Карта иногда появляется только в верхнем левом углу своего div

Ответ 1

Карта работает, когда размер браузера изменяется, так как ширина и высота заданы правильно, а событие изменения размера увеличивается.

Самое быстрое решение вашей проблемы - вызвать метод изменения размера (ниже) после javascript, который показывает его. Может быть, после showDiv('mapDiv'); в showScoresAndCenterOn?

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

Ответ 2

Чтобы исправить это, вам нужно

• Измените размер карты

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

• Переместите карту, где myCenter - ваша точка lat, lng.

  map.setCenter(myCenter);
  

Это немного взломать, но он работает.

Ответ 3

У меня была та же проблема, которая заставляла меня беспокоиться в течение нескольких дней, и сегодня я нашел решение, и это сработало!

В моем случае я использовал вкладки для просмотра разных частей моей страницы. Это не было jquery ui, я сделал это. На одной вкладке я разместил код карты. Когда я нажал на вкладку карт, он показал мне карту, но сломал ее. Наконец, я понял проблему и решение.

Чтобы скрыть мои элементы, я использовал свойство display:none, чтобы показать, что я использовал свойство display:block. Когда карта google попыталась получить размер блока контейнера, он нашел 0 x 0, потому что он был скрыт. Таким образом, карта показала себя сломанной.

Затем я изменил свой css для закладки карты только на position:absolute;left:-99999px; вместо display:none и использовал jquery, чтобы добавить класс и удалить при необходимости с помощью свойств выше. Затем код начал работать! Моя карта была исправлена.

Ответ 4

set containsar #Div width to 100%.. это работает для меня.

Ответ 5

Отличная благодарность, я перешел в ту же проблему. И действительно, когда вы помещаете дисплей: ни один из них не даст проблем при попытке просмотра карт Google. Я удалил дисплей: нет и изменил его на позицию за пределами экрана, при нажатии кнопки эта позиция изменяется в сторону где-то на экране, и моя карта отображается правильно.