Проблема с GoogleMap offsetWidth

У меня проблема с отображением GoogleMap.

Вот исходный код веб-сайта: http://pastebin.com/LjhVbEF7

Когда я пытаюсь запустить этот сайт, карта не отображается. Консоль Firebug сообщает Uncaught TypeError: Cannot read property 'offsetWidth' of null

Вы знаете, что я делаю неправильно? Я знаю, что в сети много рабочих примеров, но этот код генерируется специальным script, и я не могу сильно его помешать. Может быть, я забыл установить некоторые переменные?

спасибо, Mike

=================

EDIT: Этот код работает только тогда, когда я положу JS в определение функции и вызову его в body onload param. У вас есть идея, как я могу заставить его работать без использования такой функции и параметра onload?

ОТВЕТЫ

Ответ 1

Я понимаю, что это, вероятно, немного поздно, но, надеюсь, он сможет помочь кому-то другому:

В вашем случае функция инициализации не запускается, хотя она также может быть вызвана атрибутами ширины и высоты, которые не задаются в контейнере div. Если вы не хотите просто добавлять событие загрузки в тег body, вы можете использовать следующий jQuery:

//Add onload to body
$(window).load(function(){
    initialize()
});

Ответ 2

Возможно, вы работаете в AngularJS? Я был, и эта проблема сохранялась за всеми вышеперечисленными решениями. Причина заключалась в том, что частичное, где я находил свой div div карты, не завершалось вовремя, поэтому div был нулевым, поэтому полученная вами ошибка.

См. способ Angular для вызова GoogleMaps:

Инициализировать карту Google в AngularJS

Ответ 3

Это связано с тем, что ваш script выполняется перед загрузкой элемента DOM. Простое решение состоит в том, чтобы поместить его в функцию и вызвать ее при завершении загрузки. Пожалуйста, обратитесь к вопросу ниже:

API Google MAP Uncaught TypeError: Невозможно прочитать свойство offsetWidth нулевого

Ответ 4

В большинстве случаев я получаю эту ошибку, потому что элемент, на который я ссылаюсь в getElementById, отсутствует на странице, или я использую неверный идентификатор. Очевидная ошибка, но убедитесь, что вы дважды проверяете перед погружением в более сложные решения.

Ответ 5

Не уверен, но это может быть строка

map_4e60b1f9c94ae.setCenter(new google.maps.LatLng(0, 0, 1));

Я думаю, что new google.maps.LatLng принимает только два атрибута, широту и долготу.

Попробуйте этот бит с сайта карты

var latlng = new google.maps.LatLng(-34.397, 150.644);

http://code.google.com/apis/maps/documentation/javascript/tutorial.html

Ответ 6

Попробуйте поместить код JavaScript в тело и ПОСЛЕ div id="map_canvas"

Что-то вроде этого:

<body>
    <div id="map_canvas"></div>

    <script type="text/javascript">
        var map_4e60b1f9c94ae = new google.maps.Map(document.getElementById("map_canvas"), {"mapTypeId":"roadmap","zoom":10});
        map_4e60b1f9c94ae.setCenter(new google.maps.LatLng(0, 0, 1));
    </script>
</body>