首页 > 解决方案 > 谷歌地图markClusterer - 语法不清楚

问题描述

在尝试了我找到的每个示例后,我无法让 Google 地图集群工作。所有标记都显示,没有控制台错误,但没有聚类。

首先,我遇到了一些问题markerClusterer not defined,有时会发生,有时不会。这显然是我的https://maps.googleapis.com/maps/api/js脚本设置为async(我的正常做法)的事实,这意味着当我为其指定的回调函数运行时,https://unpkg.com/@googlemaps/markerclusterer/dist/index.min.js可能不会加载。很高兴知道是否有办法解决这个问题(markerClusterer 代码的回调?)但是现在,为了清楚真正的问题,我已经删除了async.

由于所有标记都工作正常,我只会给出与聚类相关的代码。在初始化地图的回调函数中,我尝试了这种方法(将标记添加到数组中,然后将整个数组提供给markerClusterer):

var marker;
var markers = [];

for ( var member_id in members_data ) {

    // Add marker
    marker = new google.maps.Marker({
        position: {
            lat: members_data[ member_id ].location_data.lat,
            lng: members_data[ member_id ].location_data.lng
        },
        map: my_map,
    });
    markers.push( marker );

}

const marker_clusterer = new markerClusterer.MarkerClusterer({ my_map, markers });

我还发现了这种语法,其中标记是单独添加的:

var marker;
var markers          = [];
var marker_clusterer = new markerClusterer.MarkerClusterer({ my_map });

for ( var member_id in members_data ) {

    // Add marker
    marker = new google.maps.Marker({
        position: {
            lat: members_data[ member_id ].location_data.lat,
            lng: members_data[ member_id ].location_data.lng
        },
        map: my_map,
    });
    markers.push( marker );
    marker_clusterer.addMarker( marker );

}

两者都不起作用 - 没有控制台错误,没有聚类,正常标记都很好。关于我如何开始调试它的任何线索?

标签: google-mapsmarkerclusterer

解决方案


var marker_clusterer = new markerClusterer.MarkerClusterer({ my_map });

应该

var marker_clusterer = new markerClusterer.MarkerClusterer({ map: my_map });

推荐阅读