Карта не отображается должным образом при использовании Google Map API - PullRequest
0 голосов
/ 13 июля 2020

Я боролся с проблемой отображения карты с местоположением с помощью Google Map API. Как вы видите на странице результатов, данные из бэкэнда отображаются правильно, например house_lan и house_lng , но карта с местоположением не отображается. Подскажите, что я упустил?

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta charset="UTF-8" />
    <title>Local Schools</title>
    <link
      rel="stylesheet"
      href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"
      integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7"
      crossorigin="anonymous"
    />
    <script
      async
      defer
      src="https://maps.googleapis.com/maps/api/js?key=APIKEY&callback=initMap"
      type="text/javascript"
    ></script>
    <script type="text/javascript">
      function initMap() {
          new google.maps.Map(document.getElementById('map'), {
                center: {lat: {{house.lat}}, lng: {{house.lng}}},
                zoom: 16
              });
            }
    </script>
  </head>
  <body>
    <div class="container">
      <h1>{{house.id}}</h1>
      <div id="map" style="width: 100%; height: 500px;"></div>
      {{house.lat}} ---- {{house.lng}}
    </div>
  </body>
</html>

введите описание изображения здесь

1 Ответ

0 голосов
/ 13 июля 2020

Решено. В моем случае я задал неверные значения широте и долготе. После пересмотра он появился правильно.

...