Google map API v3 cliquez sur l'événement raise lorsque vous cliquez sur MoreMarkerClusterer?

Question

J'ai un objet Google Map API v3map sur une page qui utilise MarkerClusterer. J'ai une fonction qui ont besoin de fonctionner lorsque l'on clique sur la carte pour elle est enregistrée comme:

google.maps.event.addListener(map, 'click', function (event) { 
    CallMe(event.latLng); 
}); 

Donc mon problème est le suivant: Lorsque je clique sur un groupe de MarkerClusterer au lieu de se comporter comme un marqueur et non élever l'événement click sur la carte mais seulement celui du marqueur il appelle le clic de la carte.

Pour tester cela, je l'ai généré une alerte de l'cliquez MarkerClusterer:

google.maps.event.addListener(markerClusterer, "clusterclick", function (cluster) { 
    alert('MarkerClusterer click event'); 
}); 

Ainsi, le clusterclick augmente après l'événement click objet carte. Je ne peux alors pas enlever l'écouteur de l'objet de carte comme solution. Est-il possible de tester s'il y a eu un clic de cluster dans l'événement click de la carte? Ou un moyen de répliquer le comportement du marqueur et ne pas déclencher l'événement click de la carte lorsque clustererclick est appelé? Google et la documentation ne m'a pas aidé.

Thx

Answer 1

Voici quelque chose qui fonctionne, mais je suis toujours ouvert à d'autres meilleures réponses.

J'utilise un setTimeout pour relayer l'événement click carte pour être la dernière chose que javascript doit exécuter et vérifier avec un booléen si clustererclick a été soulevée devant quelque chose comme ceci:

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; 
}); 

Answer 2

J'ai eu mêmes problèmes et solution i fini avec:

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

Je déteste faire cela, mais dans d'autre part, il est normal de « étendre » les bibliothèques externes?

Answer 3

J'ai trouvé une autre solution qui pourrait fonctionner. Trouvez le code suivant à l'intérieur markerclusterer.js:

google.maps.event.addDomListener(this.div_, 'click', function() { 
    that.triggerClusterClick(); 
}); 

et changer à:

google.maps.event.addDomListener(this.div_, 'click', function(ev) { 
    ev.cancelBubble = true; 
    if (ev.stopPropagation) { 
    ev.stopPropagation(); 
    } 
    that.triggerClusterClick(); 
}); 

Selon Martin Matysiak de Google « ce que l'on appelle la propagation des événements, l'événement toujours "bulles" dans le Hiérarchie DOM. Vous pouvez empêcher cela de se produire avec [ce] code. "

Voir: https://groups.google.com/forum/#!topic/google-maps-js-api-v3/PGeNrzv_SAs

Answer 4

J'ai utilisé cette méthode, inspirée par les autres réponses, mais sans code de la bibliothèque du copier-coller ou de changer la bibliothèque elle-même:

originalOnAdd = ClusterIcon.prototype.onAdd; 
ClusterIcon.prototype.onAdd = function() { 
    originalOnAdd.call(this); 

    google.maps.event.addDomListener(this.div_, 'click', function (ev) { 
     ev.cancelBubble = true; 
     if (ev.stopPropagation) 
      ev.stopPropagation(); 
    }); 
}