26

我目前正在使用带有 jquery ui 地图的 markercluster 插件。

我有两个数组,一个是所有标记(称为标记),另一个是匹配搜索条件的标记(称为 current_markers)。这些是从第一个数组中筛选出来的。

然后我在屏幕上绘制 current_markers。

但是,我发现 markerclusterer 库并未根据此更改进行更新。

那么如何更新markerclusterer?

是否可以将 markerclusterer 分配给变量并调用更新函数?

4

5 回答 5

57

是的你可以。

创建地图

假设您已经创建了类似这样的 MarkerClusterer 对象:

var center = new google.maps.LatLng(10, 20);
var map = new google.maps.Map(document.getElementById('map'), { zoom: 6, center: center, mapTypeId: google.maps.MapTypeId.ROADMAP });
var markerClusterer = new MarkerClusterer(map);

添加标记

您可以向它添加多个标记,如下所示:

var markers = []
var marker = new google.maps.Marker({position: center});
markers.push(marker);
markerClusterer.addMarkers(markers);

请注意,这里我只添加了一个。

删除所有标记

然后,您可以使用 clearMarkers 清除所有标记,如下所示:

markerClusterer.clearMarkers();
markers = [];

请注意,为了整洁,我还在这里取消了标记数组。

文档

所有可用方法的完整文档可在此处获得:

https://googlemaps.github.io/js-marker-clusterer/docs/reference.html

更新链接:https ://googlemaps.github.io/js-markerclustererplus/classes/markerclusterer.html#clearmarkers

这是一个明智且相对完整的API。

于 2014-06-24T09:27:29.697 回答
17

您应该将标记对象存储在 var 中,然后按如下方式取消设置地图:

var markerCluster = new MarkerClusterer(map, markers);
/// ... later on
markerCluster.setMap(null);

完成此操作后,您可以new MarkerClusterer使用新标记初始化

更新

因为您使用的是谷歌地图 ui 插件,所以这里有一些额外的代码。我什至在带有类的按钮上添加了一个点击reset_markercluster当然这只是为了展示如何使用它来调用地图

var _map, _markerCluster;

$(function() {
  $('#map_canvas').gmap().bind('init', function(event, map) { 
    _map = map; // at this point you can call _map whenever you need to call the map

    // build up your markers here ...

    _markerCluster = new MarkerClusterer(_map, markers);  // you could also use map instead of _map here cause it's still present in this function
  });

  $("button.reset_markercluster").click(function(e) {
    e.preventDefault();
    _markerCluster.setMap(null);  // remove's the previous added markerCluster

    // rebuild you markers here ...

    _markerCluster = new MarkerClusterer(_map, newMarkers);

  });
});
于 2011-11-22T16:07:43.073 回答
12

最好使用您的 markerCluster 对象中的 clearMarkers() 方法:

http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/docs/reference.html 更新参考:https://googlemaps.github.io/js-markerclustererplus/classes/markerclusterer。 html#clearmarkers

于 2013-08-31T19:58:08.343 回答
2

marker-clusterer-plus有一个removeMarkers方法:

markerCluster.removeMarkers(markers);
于 2016-05-20T00:49:26.200 回答
2

你可以这样管理。

  1. 创建空白集群变量

    var _markerCluster;

  2. 将集群对象存储在我们的变量上。

    _markerCluster = new MarkerClusterer(地图,标记,{ imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m', });

  1. 当您删除标记时,您需要编写以下代码。
    尝试{
         _markerCluster.clearMarkers();
    }捕捉(e){
    
    }

于 2021-01-23T06:49:36.430 回答