I have a Google Map API v3 map object on a page that uses MarkerClusterer. I have a function that need to run when we click on the map to it is registered as:
google.maps.event.addListener(map, 'click', function (event) {
CallMe(event.latLng);
});
So my problem is as follows: When I click on a cluster of MarkerClusterer
instead of behaving like a marker and not raise the click event on the map but only the one from the marker it calls the click from the map.
To test this I have generated an alert from the markerclusterer
click:
google.maps.event.addListener(markerClusterer, "clusterclick", function (cluster) {
alert('MarkerClusterer click event');
});
So the clusterclick
rises after the click event of map object. I then can't remove the listener of map object as a solution. Is there any way to test if there was a clusterer click in the click event of the map? Or a way to replicate the marker behaviour and do not raise the click event of map when clustererclick
is called? Google and documentation didn’t help me.
Here is something that works but I'm still open to other better answers.
I use a setTimeout to relay the map click event to be the last thing javascript should execute and check with a boolean if clustererclick was raised before with something like this :
google.maps.event.addListener(map, 'click', function (event) {
setTimeout(function () {
if (!clusterClicked) {
CallMe(event.latLng);
alert('Map click executed');
}
else {
clusterClicked = false;
alert('ClusterClicked map click not executed');
}
}, 0);
});
google.maps.event.addListener(markerClusterer, "clusterclick", function (cluster) {
clusterClicked = true;
});
I had same problems and the solution i ended up with:
ClusterIcon.prototype.onAdd = function() {
this.div_ = document.createElement('DIV');
if (this.visible_) {
var pos = this.getPosFromLatLng_(this.center_);
this.div_.style.cssText = this.createCss(pos);
this.div_.innerHTML = this.sums_.text;
}
var panes = this.getPanes();
panes.overlayMouseTarget.appendChild(this.div_);
var that = this;
google.maps.event.addDomListener(this.div_, 'click', function(e) {
=======> e.stopImmediatePropagation(); //<====================
that.triggerClusterClick();
});
};
I hate doing this but in other hand it's normal to "extend" external libraries?
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With