Событие изменения размера API Google Maps v3

Использование Maps API v3. Согласно документации Google, если контейнер карты изменяется программно, событие изменения размера карты должно запускаться вручную.

Событие изменения размера. Разработчики должны инициировать это событие на карте, когда div изменяет размер.

Поэтому я использую:

google.maps.event.trigger(map, 'resize');

Какой слушатель следует использовать для обновления моих маркеров на основе новых границ измененного контейнера карты?

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

    console.log(map.getBounds());
});

Вышеизложенное показывает границы перед изменением размера.

Ответ 1

Всякий раз, когда размер карты изменяется, границы будут изменяться. Поэтому вы можете использовать событие bounds_changed:

google.maps.event.addListener(map, 'bounds_changed', function() {
    var bounds = map.getBounds();
});

Он имеет следующее описание:

Это событие вызывается, когда границы области просмотра изменились.

Если вы хотите, чтобы событие вызывалось после изменения размера карты, вы можете использовать логическую переменную, чтобы отслеживать, была ли только что изменена карта:

var mapResized = false;

Затем, всякий раз, когда вы запускаете функцию resize, вы можете установить переменную mapResized в true. Вы можете сделать это, используя функцию:

function resizeMap(map) {
    google.maps.event.trigger(map, 'resize');
    mapResized = true;
}

Затем в событии bounds_changed вы можете реагировать только на вызов, если mapResized истинно, а затем установите mapResized на false:

google.maps.event.addListener(map, 'bounds_changed', function() {
    if (mapResized) {
        // react here
    }
    mapResized = false;
}

Ответ 2

Если вы хотите знать, когда границы меняются, вам нужно прослушать событие "bounds_changed"

google.maps.event.addListener(map, 'bounds_changed', function() {
    console.log(map.getBounds());
});

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

google.maps.event.addListenerOnce(map, 'bounds_changed', function() {
    console.log(map.getBounds());
});

перед запуском события изменения размера.

Ответ 3

В Angular.js и IONIC я решил, вставив этот код после **

declaration of var map = new google..... :
google.maps.event.addListenerOnce(map, 'bounds_changed', function () {
   google.maps.event.trigger(map, 'resize');
   var bounds = map.getBounds();
});