javascript - 如何在 Google map v3 上添加和删除多边形？

Question

我正在尝试使用 API 的 v3 在 Google map 上显示和移除多边形。在我的 JavaScript 中，我已经有了一些自定义经纬度的 MVCArray。

我正在尝试弄清楚如何添加这些多边形，然后根据其他一些 JavaScript 事件或用户操作，例如点击一个多边形(已呈现)，该多边形将被删除。

是否有可用的代码示例？我正在努力寻找一些；他们中的大多数通常会转到一些 v2 代码。

Answer 1

在 API 文档中，有几个 adding a polygon to a map 的简单示例.这是简单的 Bermuda Triangle 中的 initialize() 函数添加事件监听器以在单击时移除多边形的示例。

function initialize() {
  var myLatLng = new google.maps.LatLng(24.886436490787712, -70.2685546875);
  var myOptions = {
    zoom: 5,
    center: myLatLng,
    mapTypeId: google.maps.MapTypeId.TERRAIN
  };

  var bermudaTriangle;

  var map = new google.maps.Map(document.getElementById("map_canvas"),
      myOptions);

  var triangleCoords = [
      new google.maps.LatLng(25.774252, -80.190262),
      new google.maps.LatLng(18.466465, -66.118292),
      new google.maps.LatLng(32.321384, -64.75737),
      new google.maps.LatLng(25.774252, -80.190262)
  ];

  // Construct the polygon
  bermudaTriangle = new google.maps.Polygon({
    paths: triangleCoords,
    strokeColor: "#FF0000",
    strokeOpacity: 0.8,
    strokeWeight: 2,
    fillColor: "#FF0000",
    fillOpacity: 0.35
  });

  bermudaTriangle.setMap(map);

  // add an event listener
  google.maps.event.addListener(bermudaTriangle, 'click', function() {
      this.setMap(null);
  });

}