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 come 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?
See here: https://developers.google.com/maps/documentation/javascript/events#EventArguments
google.maps.event.addListener(map, 'click', function(event) { placeMarker(event.latLng); });
The first parameter for the event calback is the event object. In you case it would be:
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.com/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) {
stopPropagation() and preventDefault() do not prevent the default click functionality : - mgPePe 2013-10-31 12:04
event.returnValue = false; instead. I can't confirm this now. If you get this to work, please, post the solution here - rcdmk 2013-11-06 10:35
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?
return false; will not be suitabl - Nyxynyx 2012-04-04 22:44
return false just exits the current function. So if you add it to the end of that event callback it may just work. If not I will delete my answer and bow my head in shame ; - PeeHaa 2012-04-04 22:45
return false; statement, the event may have bubbled to its paren - Nyxynyx 2012-04-04 22:51
event.cancelBubble = true in place of event.stopPropagation without having event passed will generate a event is not defined error in FF and IE, but works in Chrome. Let me try using the MarkerclustererPlus that you linked too... seem like it has code that stops event propagation to the map!! - Nyxynyx 2012-04-04 23:35
Uncaught TypeError: Object #<s> has no method 'stopPropagation'. I'm actually using methods likecluster.getCenter()which dont exist for the usual google maps event listener callback. The source code is here (http://code.google.com/p/google-maps-utility-library-v3/source/browse/trunk/markerclustererplus/src/markerclusterer.js?r=362) but I'm too new to really understand it enough. I do seeclusterIcondefined in there... maybe that can help - Nyxynyx 2012-04-04 23:01