Javascript 如何在 Google Maps v3 上添加和删除多边形？

How do I Add and Remove Polygons on Google Maps v3?

提问by Pure.Krome

I'm trying to show and remove polygons onto a Google Map, using v3 of the API. In my JavaScript, I've already got an MVCArray of some custom Lat-Longs.

我正在尝试使用 API 的 v3 在 Google 地图上显示和删除多边形。在我的 JavaScript 中，我已经得到了一些自定义 Lat-Longs 的 MVCArray。

I'm trying to figure out how to add these polygons and then, based upon some other JavaScript event or user action, such as a click on a polygon (that has been rendered), that polygon will be removed.

我试图弄清楚如何添加这些多边形，然后根据一些其他 JavaScript 事件或用户操作，例如单击多边形（已呈现），该多边形将被删除。

Can someone help? Any code or links to examples? I'm struggling to find some examples. Most of them usually go to some v2 code.

有人可以帮忙吗？任何代码或示例链接？我正在努力寻找一些例子。他们中的大多数通常会转到一些 v2 代码。

回答by Mark

In the API docs, there are a couple of simple examples of adding a polygon to a map. Here's the initialize() function from the simple Bermuda Triangleexample with the addition of adding an event listener to remove the polygon when clicked.

在 API 文档中，有几个向地图添加多边形的简单示例。这是简单百慕大三角示例中的 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);
  });

}

回答by Salman Saeed

I'm not sure if this answer applies to javascript, but definitely applies to java.

我不确定这个答案是否适用于 javascript，但绝对适用于 java。

If you have a reference to the polygon object you want to remove, then simply call the remove() method of that polygon. Refer to the documentation linked below.

如果您有对要删除的多边形对象的引用，则只需调用该多边形的 remove() 方法。请参阅下面链接的文档。

https://developers.google.com/android/reference/com/google/android/gms/maps/model/Polygon.html#remove()

https://developers.google.com/android/reference/com/google/android/gms/maps/model/Polygon.html#remove()