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

时间:2022-11-23 08:12:49

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代码。

2 个解决方案

#1


20  

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 Triangle example 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);
  });

}

#2


0  

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()

#1


20  

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 Triangle example 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);
  });

}

#2


0  

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()