【问题标题】:Google Maps Api v3 - how to remove cluster icons?Google Maps Api v3 - 如何删除集群图标?
【发布时间】:2011-05-14 02:05:45
【问题描述】:

如何从地图中删除所有集群图标(集群标记)?尝试过以下建议:

Google Maps API v3: How to remove all markers?

...但它没有用。

你能帮我实现吗?

提前谢谢你!

更新(2010-11-23)

标记存储在数组中

var markersClust = Array();

...并加上(与php结合):

markersClust.push(marker_<?php echo $team["Team"]["id"]; ?>);

var markerClusterer = new MarkerClusterer(MyMap.map, markersClust, clusterOptions);

而且效果很好。

但是,我无法将它们从地图上移除,它驱使我...

尝试删除标记(我确实做到了)

for ( var i=0; i < markersClust.length; i++) {
    markersClust[i].setMap(null);
}
markersClust = []; 

但集群图标仍在地图上。

我也尝试过:

markerClusterer.clearMarkers();

喜欢

MyMap.preventDefault();
MyMap.stopPropagation();
MyMap.clearMarkers();

但是,集群的图标仍然存在,在地图上。

我还需要做什么才能从我的地图中删除这些集群图标?请帮忙...

【问题讨论】:

    标签: google-maps-api-3 google-maps-markers markerclusterer


    【解决方案1】:

    这是正确的做法:

    // Unset all markers
    var i = 0, l = markers.length;
    for (i; i<l; i++) {
        markers[i].setMap(null)
    }
    markers = [];
    
    // Clears all clusters and markers from the clusterer.
    markerClusterer.clearMarkers();
    

    演示:http://jsfiddle.net/HoffZ/gEzxx/

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

    【讨论】:

    • 我根本不需要遍历标记。我刚刚打电话给markerClusterer.clearMarkers()
    • 是的,@hellatan,clearMarkers() 足以隐藏标记。但它们仍将留在记忆中。如果您稍后调用 clearMarkers() 并向数组添加更多标记,则如果您初始化“新 MarkerClusterer(map,markers)”,旧标记将再次显示。因此,如果要删除标记,请取消设置数组。
    • 啊,感谢@HoffZ 的澄清。我上周才开始使用 maps api,所以我的知识目前非常有限。
    • 幸运的是 MarkerCluster 有一个 getMarkers() 方法,因此您的脚本不需要保留对所有添加标记的另一个引用。
    • 这是正确答案。就我而言,我错过了clearMarkers() 电话,但其余的电话都没有。正如其他人所提到的,包含上面的内容很重要,这样您才能真正删除它们,并且不会因为它们在内存中而在您的代码中不知不觉地添加它们。
    【解决方案2】:

    我也遇到了同样的问题。我通过在初始化期间只声明我的 MarkerClusterer 来修复它:

    markerCluster = new MarkerClusterer(map);
    

    【讨论】:

      【解决方案3】:

      遍历每个标记并将该标记的映射设置为空。这将从地图上移除标记。

      【讨论】:

      • 是的,带有markersClust[i].setMap(null);标记簇 = 新数组();我从地图上删除了标记,但集群的标记仍然存在......
      • 您是否使用任何其他工具来显示集群?不要相信gmv3内置了集群。如果您能告诉我们您正在使用的其他js可能会帮助我们帮助您。
      • 我也使用gmaps-utility-library-dev.googlecode.com/svn/tags/…,请您查看我帖子的更新部分...
      • 我正在一个项目中使用相同的实用程序。确保您的 markerClusterer 变量已正确声明(我使用 var markerClusterer = null; 在 js 文件的开头)并且 markerClusterer.clearMarkers() 应该工作(不需要其他代码来删除标记或集群,只需清除那一行我的每个标记/集群的整个地图)。
      • 好提示 Crag!还是在 2019 年!
      【解决方案4】:

      这就是我所做的。我有很多标记,但是当我切换到热图时,我想删除所有标记和聚类器。当我创建标记时,我将它添加到全局标记数组中

       markers.push(marker);
      

      我这样定义集群

      markerCluster = new MarkerClusterer(map, markers);
      markerCluster.setIgnoreHidden(true);
      

      当我点击按钮显示热图时

      $.each(markers, function(k, v){
          v.setVisible(false);
      });
      markerCluster.repaint();
      

      repaint() 被调用时忽略隐藏它会隐藏所有集群图标。

      【讨论】:

        【解决方案5】:

        以 ITT 中的一些答案为基础并对其进行扩展:

        clustermarkerplus 的示例通常显示在将其初始化为整个页面加载的一部分时如何使用它。

        如果您在单页应用程序中使用该库并在边界更改时刷新标记,则声明 New MarkerClusterer(map) 将导致您不仅保留集群,而且某些标记也可能保留,大概是因为库优化了标记除了处理实际的集群图标外,还可以显示。

        因此,在页面初始化期间,您应该创建一个 MarkerClusterer 对象。然后在更新期间,您应该执行单独的标记空行为,而且,清除MarkerClusterer 对象。

        在您构建 new google.maps.Map() 后调用的示例函数,您可以在其中设置选项并创建全局变量 mapSet['facilityMarkerCluster']

        const clusterFacilityMarkers = function () {
          const clusterOptions = {
            imagePath: "/static/js/dependencies/markerclustererplus/img/m",
            gridSize: 75,
            zoomOnClick: true,
            maxZoom: 8,
          };
        
          mapSet['facilityMarkerCluster'] = new MarkerClusterer(mapSet['map'], [], clusterOptions);
        };
        

        请注意,该声明使用了一个空的标记数组,因为您的添加标记的标记更新例程可能会在此之后运行,即使它是一个完整的页面重新加载。

        在此更新例程中,在为您的地图添加标记部分期间(可能会在边界更改和正确清除各个标记后运行):

        const addFacilityMarkers = function (resolve) {
        
        // For loop over creation of your updated set of markers
                    createFacilityMarker(facilitiesJson[key]);
        
        // Update marker clusters
        
                // Clear the markercluster objects
                mapSet['facilityMarkerCluster'].clearMarkers();
                // Then add your array of markers to the markercluster object
                        mapSet['facilityMarkerCluster'].addMarkers(mapSet['facilityMarkers']);
        };
        

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 2011-05-23
          • 2012-07-20
          • 2012-05-24
          • 2013-05-02
          • 2012-03-13
          • 2010-12-05
          • 2011-12-19
          • 2011-10-07
          相关资源
          最近更新 更多