带有标记的谷歌地图没有出现地图

Posted 2023-03-28

技术标签:

【中文标题】带有标记的谷歌地图没有出现地图【英文标题】：google map with marker not appear map 【发布时间】：2020-03-09 03:01:33 【问题描述】：

当我单击地址时，我一直试图在地图上显示一个标记，但地图没有显示。

<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】：

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

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

【讨论】：

感谢您的工作。不客气，这是一场经典的谷歌地图 api 斗争。

以上是关于带有标记的谷歌地图没有出现地图的主要内容，如果未能解决你的问题，请参考以下文章

如何在圆形语音气泡内制作带有照片的谷歌地图标记？