Javascript 从数组中删除标记后更新标记簇

update markercluster after removing markers from array

提问by jaget

I am currently using markercluster plugin with jquery ui maps.

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

I have two arrays one of all markers (called markers) and one of markers that match search criteria (called current_markers). These are fitered from the first array.

我有两个数组，一个是所有标记（称为标记），另一个是匹配搜索条件的标记（称为 current_markers）。这些是从第一个数组中拟合出来的。

I then draw the current_markers on screen.

然后我在屏幕上绘制 current_markers。

I am finding however that the markerclusterer library is not updating based on this change.

然而，我发现markerclusterer 库没有根据此更改进行更新。

So how can I update the markerclusterer?

那么我怎样才能更新markerclusterer呢？

Is it possible to assign the markerclusterer to a variable and call an update function?

是否可以将标记群集分配给变量并调用更新函数？

采纳答案by Manuel van Rijn

You should store the marker object in a var and then unset the map as following:

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

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

after you've done this, you could init a new MarkerClustererwith new markers

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

Update

更新

since you are using google maps ui plugin here's some additional code. I've added a click even on a button with class reset_markerclusterofcourse this is just to show how to use it to call the map

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

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

  });
});

回答by superluminary

Yes you can.

是的你可以。

Creating the map

创建地图

Assuming you have created your MarkerClusterer object something like this:

假设您已经创建了如下所示的 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);

Adding markers

添加标记

You can add multiple markers to it something like this:

您可以向其添加多个标记，如下所示：

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

Note that here I have added only one.

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

Removing all markers

删除所有标记

You can then clear all the markers using clearMarkers something like this:

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

markerClusterer.clearMarkers();
markers = [];

Note that for tidiness I have also unset the markers array here.

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

Docs

文档

Full documentation on all the available methods is available here:

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

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

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

It's a sensible and relatively complete API.

这是一个合理且相对完整的API。

回答by HosseinSafy

It's best to use the clearMarkers() method from your markerCluster object:

最好使用 markCluster 对象中的 clearMarkers() 方法：

http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/docs/reference.html

http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/docs/reference.html

回答by Carlo Rodríguez

marker-clusterer-plushas a removeMarkersmethod:

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

markerCluster.removeMarkers(markers);