Блог

Главная - Вопросы по программированию - Карта не отображается Google Maps API V3

Карта не отображается Google Maps API V3

#google-maps #google-maps-api-3

#google-карты #google-maps-api-3

Вопрос:

Код с использованием API V3.

 function initialize ()
{
    if (GBrowserIsCompatible()) 
    { 
        var ch = new GLatLng (0,0);

        var myOptions = {
            zoom:7,
            center: ch,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }

        map = new google.maps.Map(document.getElementById("map"), myOptions);

        directionsDisplay = new google.maps.DirectionsRenderer(map, document.getElementById("map"));
        directionsDisplay.setMap(map);                  
    }
}

Код с использованием API V2.

 function initialize ()
{
     if (GBrowserIsCompatible()) 
     { 
         map = new GMap2 (document.getElementById("map"));
         map.setCenter (new GLatLng(0,0),1 );
     }
}

Код API V2 работал безупречно, код API V3 не отображает никакой карты.
Какой смысл я упускаю?

РЕДАКТИРОВАТЬ Изменил код V3 следующим образом, но карт по-прежнему нет:

 var chicago = new google.maps.LatLng (0, 0);

var myOptions = {
    zoom:1,
    center: chicago,
    mapTypeId: google.maps.MapTypeId.ROADMAP
}

map = new google.maps.Map(document.getElementById("map"), myOptions);

Ответ №1:

Убедитесь, что вы загружаете правильный Google Maps API, что у вас есть тег div с идентификатором карты и (для верности) что вы задаете div высоту и ширину. (Возможно, лучше указать высоту и ширину в таблице стилей, но для наглядности я включаю их здесь в строку.)

Вот веб-страница с вашим кодом после редактирования. Попробуйте. У меня работает.

 <html>
<head>
<title>Google Map test</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
</head>
<body>
<div id="map" style="height:500px;width:500px"></div>
<script>
var chicago = new google.maps.LatLng (0, 0);

var myOptions = {
    zoom:1,
    center: chicago,
    mapTypeId: google.maps.MapTypeId.ROADMAP
}

map = new google.maps.Map(document.getElementById("map"), myOptions);
</script>
</body>
</html>

Комментарии:

1. @Ray @ wong2 Наконец-то это решено, я бы не справился без вашей помощи! Проблема заключалась в этой строке, <script src="http://maps.google.com/maps?file=apiamp;amp;v=2amp;amp;key=GOOGLE_MAPS_KEY" я заменил ее на строку Тротта src="http://maps.google.com/maps/api/js?sensor=false" , и это помогло: mad: Спасибо всем за их помощь.

2. У меня сработало. Не были установлены высота и ширина. Спасибо!

Ответ №2:

В версии V3 все названия изменены. Например, GLatLng сейчас google.maps.LatLng . Вам нужно будет пересмотреть свой код, чтобы использовать новые имена.

Ссылка на документы на случай, если у вас их нет

Комментарии:

1. Спасибо, но это ничего не изменило: (Карты по-прежнему не отображаются!

2. Хорошо, я просто полностью выбросил if (GBrowserIsCompatible()) инструкцию, по-прежнему без изменений. Я действительно хочу это свойство: code.google.com/apis/maps/documentation/javascript/… Доступно ли это в версии V2?

3. возможно, глупый вопрос, но вы уверены, что document.getElementById («карта») действительно находит элемент DOM?

4. и это правда, что GBrowserIsCompatible() не работает с API V3. Если я включу это, карта не будет отображаться.

Ответ №3:

В версии v3 этого нет GLatLng , измените его на google.maps.LatLng 

 center: chicago,

Комментарии:

1. Я тоже пробовал это, не помогло : ( в этом документе это тоже показано без кавычек: code.google.com/apis/maps/documentation/javascript /…

2. @AnishaKaul: можете ли вы создать jsfiddle? (jsfiddle.net ), тогда я смогу узнать больше о вашем случае

3. центр должен быть объектом LatLng, а не строкой, поэтому изменение его на «чикаго» не поможет. К счастью, OP, похоже, исправил эту часть при последующем редактировании вопроса.

Ответ №4:

У меня были те же симптомы, мои карты версии v2 не отображались в версии V3. Когда я просматриваю журналы консоли браузера, я вижу ошибку: неперехваченная ошибка ссылки: GBrowserIsIncompatible не определен.

Согласно руководству по миграции с Google V2 на V3, GBrowserIsIncompatible больше не поддерживается. Я не нашел альтернативы и просто удалил логику, связанную с этой функцией. Этот сайт предлагает просто удалить функцию.

Я обнаружил другие проблемы с миграцией, которые рассматриваются в руководстве по миграции Google, приведенном выше.

Ответ №5:

1. убедитесь, что ваш ключ Google Map API указан правильно.

2- возможно, она не включена в вашей консоли Google Map.

3- ошибочно включен location API вместо map API.