带有标记的Google地图未显示地图

时间:2019-11-13 10:26:48

标签: javascript jquery laravel google-maps google-maps-markers

我一直在尝试单击地址但未显示地图时在地图上显示标记。

<div class="gmap_canvas">
  <div id="g-map"></div>
</div>
<script src="https://maps.googleapis.com/maps/api/js?key=app_key&callback=initialize" async defer></script>
function initialize() {
  var latlog = new google.maps.LatLng(39.305, -76.617);

  var map = new google.maps.Map(
    document.getElementById('g-map'), {
      zoom: 4,
      center: latlog
    }
  );

  // The marker, positioned at map
  var marker = new google.maps.Marker({
    position: latlog,
    map: map
  });
}

1 个答案:

答案 0 :(得分:1)

您应将style="width:100%; height:100%;添加到gmap_canvas div中。

<body>
  <div style="height:100%; width: 100%;"> 
    <div id="map-canvas"></div>
  </div>
</body>