在谷歌地图API v2,如果我想删除所有的地图标记,我可以简单地做:

map.clearOverlays();

我如何做到这一点在谷歌地图API v3?

看看参考API,我不清楚。


当前回答

最干净的方法是遍历地图的所有功能。标记(以及多边形、折线等)存储在地图的数据层中。

function removeAllMarkers() {
  map.data.forEach((feature) => {
    feature.getGeometry().getType() === 'Point' ? map.data.remove(feature) : null
  });
}

在通过绘图管理器添加标记的情况下,最好创建一个全局标记数组,或者在创建时将标记推入数据层,如下所示:

google.maps.event.addListener(drawingManager, 'overlaycomplete', (e) => {
    var newShape = e.overlay;
    newShape.type = e.type;

    if (newShape.type === 'marker') {
      var pos = newShape.getPosition()
      map.data.add({ geometry: new google.maps.Data.Point(pos) });

      // remove from drawing layer
      newShape.setMap(null);
    }
  });

我推荐第二种方法,因为它允许您稍后使用其他google.maps.data类方法。

其他回答

最干净的方法是遍历地图的所有功能。标记(以及多边形、折线等)存储在地图的数据层中。

function removeAllMarkers() {
  map.data.forEach((feature) => {
    feature.getGeometry().getType() === 'Point' ? map.data.remove(feature) : null
  });
}

在通过绘图管理器添加标记的情况下,最好创建一个全局标记数组,或者在创建时将标记推入数据层,如下所示:

google.maps.event.addListener(drawingManager, 'overlaycomplete', (e) => {
    var newShape = e.overlay;
    newShape.type = e.type;

    if (newShape.type === 'marker') {
      var pos = newShape.getPosition()
      map.data.add({ geometry: new google.maps.Data.Point(pos) });

      // remove from drawing layer
      newShape.setMap(null);
    }
  });

我推荐第二种方法,因为它允许您稍后使用其他google.maps.data类方法。

谷歌的Demo Gallery有一个关于他们如何做到这一点的演示:

http://code.google.com/apis/maps/documentation/javascript/examples/overlay-remove.html

您可以查看源代码以查看它们如何添加标记。

长话短说,他们把标记保存在一个全局数组中。当清除/删除它们时,它们循环遍历数组,并在给定的标记对象上调用". setmap (null)"。

然而,这个例子展示了一个“技巧”。对于本例,“清除”意味着将它们从映射中删除,但将它们保留在数组中,这允许应用程序快速将它们重新添加到映射中。在某种意义上,这就像“隐藏”它们。

“Delete”也会清除数组。

google.maps.Map.prototype.markers = new Array();

google.maps.Map.prototype.addMarker = function(marker) {
    this.markers[this.markers.length] = marker;
};

google.maps.Map.prototype.getMarkers = function() {
    return this.markers
};

google.maps.Map.prototype.clearMarkers = function() {
    for(var i=0; i<this.markers.length; i++){
        this.markers[i].setMap(null);
    }
    this.markers = new Array();
};

我认为V3中没有,所以我使用了上面的自定义实现。

免责声明:我没有写这段代码,但我忘记保留引用时,我合并到我的代码库,所以我不知道它来自哪里。

这是谷歌自己在至少一个样本中使用的方法:

var markers = [];

// Clear out the old markers.
markers.forEach(function(marker) {
  marker.setMap(null);
});
markers = [];

检查谷歌样本完整的代码示例:

https://developers.google.com/maps/documentation/javascript/examples/places-searchbox

我发现使用google-maps-utility-library-v3项目中的markermanager库是最简单的方法。

1. 设置标记管理器

mgr = new MarkerManager(map);
google.maps.event.addListener(mgr, 'loaded', function () {
    loadMarkers();
});

2. 向MarkerManager添加标记

function loadMarkers() {
  var marker = new google.maps.Marker({
            title: title,
            position: latlng,
            icon: icon
   });
   mgr.addMarker(marker);
   mgr.refresh();
 }

3.要清除标记,只需要调用MarkerManger的clearMarkers()函数

mgr.clearMarkers();