javascript - 谷歌地图聚类器

Question

我已经让聚类标记在某些标记上成功工作，但是，似乎如果该区域太拥挤，聚类就不会出现。我正在使用 JavaScript API。

  this.map = new google.maps.Map(map, mapOptions);
  this.markers = data.map((location) => {
    if (location.location === null) return
    const marker = new google.maps.Marker({
      position: { lat: location.location.coordinates[0], lng: location.location.coordinates[1]},
      map: this.map
    });
    return marker
  });
  const markerCluster = new MarkerClusterer(this.map, this.markers, {
    imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m'
  });

我会发布图片，但我需要更多声誉。

我应该切换到热图还是这是集群库的已知限制？

编辑似乎当我将标记数量限制为 179 时，它会将它们全部聚类，但是当我限制为 180 时，第 180 个标记将被放置在聚类之外

Answer 1

MarkerClusterer 库中没有 180 个标记的限制。当您查看this example时您可以看到超过 400 个标记根据 gridSize 聚集在一起。

您的 gridSize 不应太小，以便聚集更大的标记区域，但您似乎使用默认选项，这应该适用于您的示例。

创建标记时不必定义 map - MarkerClusterer 负责将它们显示在 map 上。

this.markers = [];
data.forEach(function(entry) {
    if (entry.location === null) return
    marker = new google.maps.Marker({
        position: { 
            lat: location.location.coordinates[0],
            lng: location.location.coordinates[1]
        }
    });
    markers.push(marker);
});
markerCluster = new MarkerClusterer(this.map, this.markers, {
    imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m'
});

另请查看markerClusterer 的以下选项，根据您的需要进行配置:

• gridSize:簇的网格大小(以像素为单位)。
• maxZoom:标记可以成为集群一部分的最大缩放级别。
• minimumClusterSize:集群中标记的最小数量在隐藏标记并显示计数之前进行聚类。