Google maps API 3 removeListener не работает / ведет себя странно

Question

У меня есть прослушиватель click для каждого из моих маркеров, вызывающих функцию displayInfo, пользовательский информационный блок ..

google.maps.event.addListener(markers[i], 'click', function() {
        //stop updating markers
         google.maps.event.removeListener(updateMarkersProcess);

        //call display custom infowindow function
        displayInfo(this);
    });

У меня есть bounds_change слушатель на моей карте для «привязки» пользовательского инфобокса к маркеру.Примерно так:

function displayInfo(marker) {

 var e = $('infobox');

overlay.getPanes().floatPane.appendChild(e);

displayInfoProcess = google.maps.event.addListener(map, 'bounds_changed', function() {

    show('infobox');

    var markerOffset = overlay.getProjection().fromLatLngToDivPixel(marker.position);

    e.style.top = markerOffset.y + 20 + 'px';
    e.style.left = markerOffset.x - 40 + 'px';

    e.innerHTML = marker.store + '<br><em>' + convertDistance(marker.distance);   

});
map.panTo(marker.position); 
}

У меня есть click слушатель на карте, чтобы скрыть информационный блок и остановить bounds_change слушатель ...

[УДАЛИТЬ КОД ЛИСТЕНЕРА ЗДЕСЬ]

google.maps.event.addListener(map, 'click', function() {

       google.maps.event.removeListener(displayInfoProcess);
       // google.maps.event.clearListeners(map, 'bounds_changed');
       hide('infobox');

    });

Это скрывает информационный блок, но дело в том, что это, похоже, не удаляет слушателя.Вот распечатка из журнала:

// Перед нажатием на маркер (без прослушивателя)

displayInfoProcess null

// После нажатия на маркер (слушатель)

displayInfoProcess Ue b: qh d: "bounds_changed" e: function () {id: 1480 j: null l: 0 proto : Ue

// После нажатия на карту (по-прежнему слушатель)

displayInfoProcess Ue b: null d: "bounds_changed" e: null id: 1480 j: null l: 0 proto : Ue

И сделать вещи действительно странными, если я ..

1) Нажмите на маркер Это показывает infoBox1

2) Щелкните по другому маркеру Отображается infoBox2 вместо 1

3) Щелкните карту Это скрывает infoBox2

4) Панорамирование карты

.. отображается информационный блок (1) из маркера FIRST !!

Есть ли лекарство ??

Answer 1

Ссылка на прослушиватель удаляется (посмотрите на свойства b: и e:, они оба равны NULL), все что осталось - это оболочка. Если слушатель не был удален в любое время, когда вы пытаетесь панорамировать карту, он вернется к маркеру, который добавил слушателя.

Поскольку все, что вы, похоже, делаете с событием displayInfoProcess, отображает информационный блок, я бы использовал google.maps.event.addListenerOnce (). Он удалит слушателя сразу после его выполнения.

function displayInfo(marker) {    
    google.maps.event.addListenerOnce(map, 'bounds_changed', function() {
        //set infobox info...
    });
    map.panTo(marker.position);
}

Мне лично не нравится использовать событие click на карте. Когда пользователь нажимает на карту, он обычно пытается панорамировать карту, поэтому вместо этого я использую события dragstart, drag и dragend. При использовании события dragstart вам не нужно отпускать кнопку мыши перед попыткой панорамирования карты.

Вот пример использования addListenerOnce и dragstart: http://jsfiddle.net/bryan_weaver/vPN7R/

Answer 2

Добавление

if(displayInfoProcess) {google.maps.event.removeListener(displayInfoProcess);}

в начало функции displayInfo, похоже, сделало свое дело.