Google Map Clusterer

馋奶兔 提交于 2019-12-12 01:24:17

问题


I've got the Cluster Marker working successfully on some markers, however, it seems that if the area is too congested the cluster won't appear. I'm using the 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'
  });

I would post an image but I need more reputation.

Should I switch to a heatmap or is this a known limitation of the cluster library?

EDIT It seems when I limit the amount of markers to 179, it clusters them all, but when I limit to 180, the 180th is placed outside the cluster


回答1:


There is no limitation of 180 markers in the MarkerClusterer library. When you have a look at this example you can see over 400 markers clustered depending on the gridSize.

Your gridSize shouldn't be too small so a bigger area of markers is clustered, but you seem to use the default options, which should work in your example.

You don't have to define the map when creating the markers - the markerClusterer takes care of displaying them on the 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'
});

Also check out the following options of the markerClusterer to configure it to your needs:

  • gridSize: The grid size of a cluster in pixels.
  • maxZoom: The maximum zoom level that a marker can be part of a cluster.
  • minimumClusterSize: The minimum number of markers to be in a cluster before the markers are hidden and a count is shown.


来源:https://stackoverflow.com/questions/41905500/google-map-clusterer

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!