Google Maps V3 - Изменение размера карты и плитки карты Спорада

Question

Я использую Google Maps и метод JqueryUI Resizable() (из JqueryUI 1.8.7).

Если вы нажмете на правый нижний угол этой карты, вы можете перетащить и развернуть ее. http://www.energyjustice.net/t=eb5f7o

Однако, если вы сделаете его шире, Google предоставит только слои карты шириной до 800 пикселей. У него похожая проблема, если вы сделаете его выше.

Если вы подождете пару минут, иногда будет загружаться полный набор плиток. В общем, когда вы расширяете карту, она ведет себя очень странно. Похоже, что работает лучше в Firefox, чем в Chrome. Почему это происходит? Что я могу сделать, чтобы избежать этого спорадического поведения?

Answer 1

После изменения размера контейнера необходимо указать карте заполнить все доступное пространство, вызвав событие "изменить размер".

Строка ниже работала на странице по вашей ссылке (срабатывает от firebug после изменения размера)

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

В соответствии с документацией API JQueryUI.Resizable, вызов этой функции при возникновении события stop (конец изменения размера) должен выполнить эту работу.

Answer 2

Я нашел это решение после стольких усилий:

Пожалуйста, добавьте следующий код после инициализации карты:

var idleListener = google.maps.event.addListener(map, 'idle', function() { //important for full map shown 
  google.maps.event.trigger(map, 'resize');
  // google.maps.event.removeListener(idleListener);
});

var idleListener2 = google.maps.event.addListener(map, 'mousemove', function() {
  google.maps.event.trigger(map, 'resize');
  // google.maps.event.removeListener(idleListener2);
});