Загрузка Google Maps API после отображения страницы

Question

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

1. Сначала загрузите статические элементы, чтобы изначально страница загружалась быстро.
2. Отобразите уведомление о загрузке в заполнителе карты, чтобы пользователь знал, чтокарта идет вверх
3. Загрузить и отобразить карту

Я сделал это:

$(document).ready(function() {
  map_initialize();
}

Функция map_initialize() загружает карту в свой контейнер div,Однако это все равно не будет отображать статические элементы кулака.Страница будет ждать, пока не закончится map_initialize(), а затем загрузить статические элементы одновременно с картой.

Answer 1

Событие window.onload будет ожидать загрузки изображений и любого другого ресурса в документе до его запуска:

Событие загрузки происходит в конце процесс загрузки документа. В этот точка, все объекты в документ находится в DOM, и все изображения и субкадры закончены загрузка.

Источник: Центр разработки Mozilla: window.onload

Вы можете также прочитать следующую статью о переполнении стека для дальнейшего чтения:

• Выполнить JavaScript, когда страница полностью загружена

Поэтому все, что вам нужно сделать, это установить обработчик события window.onload следующим образом:

window.onload = map_initialize;

Answer 2

Если вы используете событие onLoad, статические элементы должны загружаться перед вашей картой. Метод ready в JQuery будет запущен до того, как все будет загружено; он запускается, как только document готов.

Answer 3

Попробуйте:

$('body').load(function() {
  map_initialize();
});

[править] Я только что нашел это из комментариев пользователей в документации jQuery: http://api.jquery.com/load-event/#comment-43474051