Google map API v3 событие кликает при кликеMarkerClusterer? - PullRequest
Новая
       15

Google map API v3 событие кликает при кликеMarkerClusterer?

4 голосов
/ 21 мая 2010

У меня есть Google Map API v3 map объект на странице, который использует MarkerClusterer . У меня есть функция, которую нужно запустить, когда мы нажимаем на карту, чтобы она была зарегистрирована как: 

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

Итак, моя проблема заключается в следующем: когда я щелкаю по кластеру MarkerClusterer, вместо того, чтобы вести себя как маркер, и не вызывать событие щелчка на карте, а только тот, который из маркера вызывает клик с карты. *

Чтобы проверить это, я сгенерировал предупреждение от нажатия кнопки markerclusterer: 

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

Таким образом, кластерный щелчок возрастает после события щелчка объекта карты. Я тогда не могу удалить слушателя объекта карты как решение. Есть ли способ проверить, был ли щелчок кластера в событии щелчка на карте? Или способ повторить поведение маркера и не вызывать событие щелчка карты при вызове clustertecclick? Google и документация мне не помогли.

Thx

Ответы [ 4 ]

5 голосов
/ 21 мая 2010

Вот кое-что, что работает, но я все еще открыт для других лучших ответов.

Я использую setTimeout для ретрансляции события щелчка на карте, чтобы быть последним, что должен выполнить javascript, и проверил с помощью логического значения, было ли поднято clustertererclick с помощью чего-то вроде этого: 

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;
});
4 голосов
/ 25 ноября 2013

У меня были те же проблемы и решение, в результате которого я получил: 

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

Я ненавижу это делать, но с другой стороны нормально "расширять" внешние библиотеки?

2 голосов
/ 01 марта 2015

Я нашел другое решение, которое может работать. Найдите следующий код внутри markerclusterer.js: 

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

и измените его на: 

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

По словам Мартина Матисяка из Google, «это называется распространением событий, событие всегда« всплывает »в иерархии DOM. Вы можете предотвратить это с помощью [этого] кода».

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

0 голосов
/ 03 мая 2017

Я использовал этот метод, вдохновленный другими ответами, но без копирования-вставки кода библиотеки или изменения самой библиотеки: 

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