I am using the Markercluster plugin for Google Maps API V3. I want to access the click event when the user clicks on the cluster icon. The closest that I can e to is

JS Code

google.maps.event.addListener(mc, "clusterclick", function (cluster) {
    event.stopPropagation();
});

Problem: event.stopPropagation() only works this way in Chrome and not Firefox or IE. It can only work if it is passed a event object is added as a parameter to the function like so:

$("#div").click(function(event) { 
    event.stopPropagation();
}

However, I dont know the DOM element of the cluster icon created by MarkerClusterer so I cant select it!! What should I do?

I am using the Markercluster plugin for Google Maps API V3. I want to access the click event when the user clicks on the cluster icon. The closest that I can e to is

JS Code

google.maps.event.addListener(mc, "clusterclick", function (cluster) {
    event.stopPropagation();
});

Problem: event.stopPropagation() only works this way in Chrome and not Firefox or IE. It can only work if it is passed a event object is added as a parameter to the function like so:

$("#div").click(function(event) { 
    event.stopPropagation();
}

However, I dont know the DOM element of the cluster icon created by MarkerClusterer so I cant select it!! What should I do?

• javascript
• jquery
• google-maps
• google-maps-api-3

2 Answers 2

See here: https://developers.google./maps/documentation/javascript/events#EventArguments

google.maps.event.addListener(mc, "clusterclick", function (cluster) {     
    cluster.stopPropagation();     
});

Since this is a custom event and the programmers didn't passed the event object as a parameter, your solution would be to implement it yourself:

Lines 150 and 151 from http://code.google./p/google-maps-utility-library-v3/source/browse/trunk/markerclustererplus/src/markerclusterer.js?r=362:

from:

google.maps.event.trigger(mc, "click", cClusterIcon.cluster_);
google.maps.event.trigger(mc, "clusterclick", cClusterIcon.cluster_); // deprecated name 

to:

google.maps.event.trigger(mc, "click", e, cClusterIcon.cluster_);
google.maps.event.trigger(mc, "clusterclick", e, cClusterIcon.cluster_); // deprecated name 

Note the e as the 3rd parameter. This is the event object from the original event that calls this 2 lines on line 139:

google.maps.event.addDomListener(this.div_, "click", function (e) {

You can try to use return false;. Although this both stops event bubbling as well as default behaviour. So I don't know whether you can use it in your specific case.

UPDATE

clusterclick event is deprecated. You should use the click event.

Have you already tried both doing .stopPropagtion and .cancelBubble = true?