Я пытаюсь вставить карту Google в мой HTML-код, но он продолжает выдавать мне эту ошибку: «myMap это не функция», вот мой код:

function myMap() {
    var mapOptions = {
        center: new google.maps.LatLng(51.5, -0.12),
        zoom: 10,
        mapTypeId: google.maps.MapTypeId.HYBRID
    }
var map = new google.maps.Map(document.getElementById("map"), mapOptions);
}
#map{
  width: 100%;
  height: 250px;
  }
<div id="map"></div>

    <script src="https://maps.googleapis.com/maps/api/js?key=APIKEY4&callback=myMap"></script>
-1
stephjhonny 27 Май 2017 в 18:50

2 ответа

Лучший ответ

Размещенный код работает как есть, если фрагмент кода переставлен для определения функции myMap перед включением API. Обратите внимание, что вам (в настоящее время) не нужен ключ на stackoverflow.com, так как он доступен с доступом без ключа.

#map {
  width: 100%;
  height: 250px;
}
<div id="map"></div>
<script>
  function myMap() {
    var mapOptions = {
      center: new google.maps.LatLng(51.5, -0.12),
      zoom: 10,
      mapTypeId: google.maps.MapTypeId.HYBRID
    }
    var map = new google.maps.Map(document.getElementById("map"), mapOptions);
  }
</script>
<script async defer src="https://maps.googleapis.com/maps/api/js?callback=myMap"></script>
1
geocodezip 27 Май 2017 в 16:47

Вы никогда не инициализируете реальную карту. Попробуйте следующее. (это приведет к ошибкам при удалении ключа API)

function myMap() {
    var mapOptions = {
        center: new google.maps.LatLng(51.5, -0.12),
        zoom: 10,
        mapTypeId: google.maps.MapTypeId.HYBRID
    }
var map = new google.maps.Map(document.getElementById("map"), mapOptions);
}

google.maps.event.addDomListener(window, 'load', myMap);
#map{
  width: 100%;
  height: 250px;
  }
<div id="map"></div>

    <script src="https://maps.googleapis.com/maps/api/js?key=APIKEY4&callback=myMap"></script>
1
Josh Walshaw 27 Май 2017 в 16:00