Google map API v3 evento click rilancio quando clickingMarkerClusterer?

Question

Ho un Google Map API v3 mappa oggetto su una pagina che utilizza MarkerClusterer . Ho una funzione che devono eseguire quando si clicca sulla mappa per essa è registrata come:

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

Quindi il mio problema è il seguente:. Quando clicco su un cluster di MarkerClusterer invece di comportarsi come un marcatore e non generare l'evento click sulla mappa, ma solo quella dal marcatore viene chiamato il click dalla mappa

Per verificare questa ho generato un allarme dal markerclusterer clic:

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

Così il clusterclick aumenta dopo l'evento click di carta oggetto. Ho quindi non è possibile rimuovere l'ascoltatore di carta oggetto come una soluzione. C'è un modo per verificare se ci fosse un clusterer click in caso click della mappa? O un modo per replicare il comportamento marcatore e non generare l'evento click di mappa quando clustererclick si chiama? Google e la documentazione non mi ha aiutato.

Thx

Answer 1

Qui è qualcosa che funziona, ma io sono ancora aperto ad altre risposte migliori.

Io uso un setTimeout per trasmettere l'evento mappa Clicca per essere l'ultima cosa javascript deve eseguire e verificare con un valore booleano se clustererclick è stata sollevata prima con qualcosa di simile:

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

ho avuto stessi problemi e la soluzione che ho finito con:

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

Odio fare questo, ma in altra parte è normale "estendere" librerie esterne?

Answer 3

Ho trovato un'altra soluzione che può funzionare. Trova le markerclusterer.js all'interno seguente codice:

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

e modificarlo:

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

Secondo Martin Matysiak di Google "questo si chiama propagazione degli eventi, l'evento sempre 'bolle' in alto nella gerarchia DOM. È possibile evitare che questo succeda con il codice [che]."

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

Answer 4

Ho usato questo metodo, ispirato alle altre risposte, ma senza codice della libreria o la modifica della libreria stessa incollare copia-:

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