API Карт Google - Карта не загружается

Я пытаюсь вставить карту google на свой сайт, но с небольшим успехом. Я использовал следующий раздел кода: (я использую фактический ключ апите на моем собственном компьютере)API Карт Google - Карта не загружается

<script type="text/javascript" 
    src="https://maps.googleapis.com/maps/api/js?key=myapikey&sensor=true"> 
</script> 
<script type="text/javascript"> 
    function initialize() { 
    var mapOptions = { 
     center: new google.maps.LatLng(-34.397, 150.644), 
     zoom: 8, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    var map = new google.maps.Map(document.getElementById("map-canvas"), 
     mapOptions); 
    } 
    google.maps.event.addDomListener(window, 'load', initialize); 
</script>

внутри <body> секции я добавил <div id="map-canvas" style="width: 40%; height: 40%"></div>

Как я могу справиться с этой проблемой? Заранее благодарен

источник

2013-03-29 Anonymous

Похоже проблема с ключом апи, попытайтесь удалить, что из URL –

Как я уже упоминал в сообщении, у меня есть ключ api, просто заменил его на «myapikey» для сообщения – 2013-03-29 09:40:43

, используя инструменты chrome dev, чтобы посмотреть, загружены ли файлы js-карт, если да, то используйте инструмент отладки и установите точку разрыва в map var и убедитесь, что объект создан. –

Укажите ширину и высоту холста как абсолютные длины, а не %.

Например:

<div id="map-canvas" style="width: 300px; height: 400px"></div>

В качестве альтернативы, палка с % для холста, но поместить его в контейнер с заданной шириной и высотой как абсолютные длины.

<div style="width:1000px; height:800px;"> 
    <div id="map-canvas" style="width: 40%; height: 40%"></div> 
</div>

источник

2013-03-29 10:45:32

У нас есть победитель :) Спасибо! – 2013-03-29 10:54:10

В случае, если вы не хотите, чтобы установить размер абсолютной ширины и высоты в рх, убедитесь, что все родительские теги имеют высоту 100%

, например, HTML -> тело -> some_ids -> карта-идентификатор

Все они имеют ширину и высоту в%

исх: https://developers.google.com/maps/documentation/javascript/tutorial

источник

2017-12-27 12:41:01

API Карт Google - Карта не загружается

ответ

Смежные вопросы