markerClusterer on click zoom
I modified the clusterclick event as suggested:
/**
* 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);
}
};
It works great! Thanks a lot
There has been an update to the MarkerClusterer source code, allowing much easier access to the click event:
google.maps.event.addListener(markerCluster, 'clusterclick', function(cluster) {
// your code here
});
where 'markerCluster' ist the MarkerCluster object. Inside the function you may also access
cluster.getCenter();
cluster.getMarkers();
cluster.getSize();
I use this to switch to a different map type, as I use a custom tile set for easier overview on lower zoom levels:
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)
Regards Jack
You can do this without modifying the source code by using a listener on the clusterclick markerClusterer event:
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. I set zoomOnClick=false to have finer control of the map zooming behaviour to control the zoom amount and zoom location each click triggers.