markerClusterer上点击缩放

markerClusterer on click zoom

本文关键字：缩放 markerClusterer      更新时间：2023-09-26

我刚刚在我的谷歌地图上添加了一个MarkerClusterer。它工作得很好。

我只是想知道是否有任何方法调整放大行为时，集群被点击。如果可能的话，我想更改一下缩放级别。

有办法做到这一点吗?

谢谢

对MarkerClusterer源代码进行了更新，允许更容易地访问单击事件:

google.maps.event.addListener(markerCluster, 'clusterclick', function(cluster) {
    // your code here
});

其中'markerCluster'列出了markerCluster对象。在函数内部你也可以访问

cluster.getCenter();
cluster.getMarkers();
cluster.getSize();

我用它来切换到不同的地图类型，因为我使用自定义平铺设置，以便在较低的缩放级别上更容易地进行概述:

map.setCenter(cluster.getCenter()); // zoom to the cluster center
map.setMapTypeId(google.maps.MapTypeId.ROADMAP); // switch map type
map.setOptions(myMapOptions); // apply some other map options (optional)

的问候杰克

您可以通过在clusterclick markerClusterer事件上使用侦听器来完成此操作，而无需修改源代码:

var mcOptions = {gridSize: 40, maxZoom: 16, zoomOnClick: false, minimumClusterSize: 2};
markerClusterer = new MarkerClusterer(map, markers, mcOptions);
google.maps.event.addListener(markerClusterer, 'clusterclick', function(cluster){
    map.setCenter(markerClusterer.getCenter());
    map.setZoom(map.getZoom()+1);
});

ie。我设置zoomOnClick=false是为了更好地控制地图缩放行为，控制每次点击触发的缩放量和缩放位置。

我按照建议修改了clusterclick事件:

/**
* Triggers the clusterclick event and zoom's if the option is set.
*/
ClusterIcon.prototype.triggerClusterClick = function() {
var markerClusterer = this.cluster_.getMarkerClusterer();
// Trigger the clusterclick event.
google.maps.event.trigger(markerClusterer, 'clusterclick', this.cluster_);
if (markerClusterer.isZoomOnClick()) {
// Zoom into the cluster.
// this.map_.fitBounds(this.cluster_.getBounds());
// modified zoom in function
this.map_.setZoom(markerClusterer.getMaxZoom()+1);
 }
};

效果很好!谢谢大家

看来这个API只允许你切换缩放功能

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

所以你必须编辑源代码，它似乎在第1055行

/**
 * Triggers the clusterclick event and zoom's if the option is set.
 */
ClusterIcon.prototype.triggerClusterClick = function() {
  var markerClusterer = this.cluster_.getMarkerClusterer();
  // Trigger the clusterclick event.
  google.maps.event.trigger(markerClusterer, 'clusterclick', this.cluster_);
  if (markerClusterer.isZoomOnClick()) {
    // Zoom into the cluster.
    this.map_.fitBounds(this.cluster_.getBounds());
  }
};

如果有人需要在coffeescript中编写这个函数，我将顶部答案和标记的答案合并到一个代码片段中。

mcOptions =
  maxZoom: 16
markerCluster = new MarkerClusterer map, markers, mcOptions
# listener if a cluster is clicked
google.maps.event.addListener markerCluster, "clusterclick", (cluster) ->
  if markerCluster.isZoomOnClick() # default is true
    #get bounds of cluster
    map.fitBounds cluster.getBounds()
    #zoom in to max zoom plus one. 
    map.setZoom markerCluster.getMaxZoom() + 1

此代码检查是否放大，单击是否设置。如果是，则将其放大到max zoom + 1，并以集群为中心。非常简单的代码。

相关文章：