在Google Maps API v3中使用MarkerClusterer限制缩放级别时出错

时间:2012-10-17 00:41:46

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

我正在使用此处的代码:Integrating Spiderfier JS into markerClusterer V3 to explode multi-markers with exact same long / lat在点击MarkerClusterer创建的包含位于同一位置的点的群集时限制缩放级别。

现场示例在这里:    http://www.adultlearnersfestival.com/newsite/yourarea/map.html

我在Firebug中遇到错误:

Error: TypeError: markers is undefined 

并且无法解决导致它的原因。具体代码是:

var minClusterZoom = 14;
mc.setMaxZoom(minClusterZoom);
gm.event.addListener(mc, 'clusterclick', function(cluster) {
  map.fitBounds(cluster.getBounds()); // Fit the bounds of the cluster clicked on
  if( map.getZoom() > minClusterZoom+1 ) // If zoomed in past 15 (first level without clustering), zoom out to 15
  map.setZoom(minClusterZoom+1);
});

任何帮助非常感谢。 - 汤姆

3 个答案:

答案 0 :(得分:1)

我采用了不同的方法:markerClusterer on click zoom并编辑MarkerClusterer源代码如下

来自这个

/**
 * 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());
  }
};

到这个

/**
 * 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
        if( this.map_.getZoom() > markerClusterer.getMaxZoom()+1 )
          this.map_.setZoom(markerClusterer.getMaxZoom()+1);
  }
};

答案 1 :(得分:0)

看起来像MarkerClusterer中的错误。在for循环中的这个函数里面,标记是未定义的,这意味着this.getMarkers()返回undefined,看起来像是错误的:

/**
 * Returns the bounds of the cluster.
 *
 * @return {google.maps.LatLngBounds} the cluster bounds.
 */
Cluster.prototype.getBounds = function() {
  var bounds = new google.maps.LatLngBounds(this.center_, this.center_);
  var markers = this.getMarkers();
  for (var i = 0, marker; marker = markers[i]; i++) {
    bounds.extend(marker.getPosition());
  }
  return bounds;
};

可能应该是(未经测试):

/**
 * Returns the bounds of the cluster.
 *
 * @return {google.maps.LatLngBounds} the cluster bounds.
 */
Cluster.prototype.getBounds = function() {
  var bounds = new google.maps.LatLngBounds(this.center_, this.center_);
  var markers = this.getMarkers();
  if (markers && markers.length) 
  {
    for (var i = 0; i < markers.length; i++) {
      bounds.extend(markers[i].getPosition());
    }
  } 
  return bounds;
};

Works using MarkerClustererPlus

答案 2 :(得分:0)

我解决了改变这个问题的问题:

Cluster.prototype.getBounds = function() {
  var bounds = new google.maps.LatLngBounds(this.center_, this.center_);
  var markers = this.getMarkers();
  for (var i = 0, marker; marker = markers[i]; i++) {
    bounds.extend(marker.getPosition());
  }
  return bounds;
};

到此:

Cluster.prototype.getBounds = function() {
  var bounds = new google.maps.LatLngBounds(this.center_, this.center_);
  var markers = this.getMarkers();
  var minZoom =10 
  mc.setMaxZoom(minZoom);//The maximum zoom level that a marker can be part of a cluster  
  for (var i = 0; i < markers.length; i++) {
    bounds.extend(marker.getPosition());//Extends this bounds to contain the given point.
  }  
  if( map.getZoom() > minZoom+1 ){// If zoomed in past 11, the first level without clustering, zoom out to 11.
  map.setZoom(minZoom+1);
  } 
  return bounds;

};