嘗試將google map api添加到我的網站

Question

有人可以幫我，甚至在添加API密鑰后告訴我為什么我的地圖根本不顯示在頁面上嗎？ 我寫錯了什么？

https://jsfiddle.net/hute2o63/3/

<h3>MY Demo Map</h3>
<div id="map-canvas"></div>

Answer 1

以下是您需要使地圖正常工作的內容：)

根據您要實現的目標，頁面上所需的內容可能會有所不同。

HTML：

<h3>MY Demo Map</h3>
<div id="canvas-map"></div>
<script>
  function initMap() {
    var uluru = {lat: 0, lng: 0};
    var map = new google.maps.Map(document.getElementById('canvas-map'), {
    zoom: 4,
    center: uluru
    });
  }
</script>

<script async defer
src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY_HERE&callback=initMap">
</script>

CSS：

#canvas-map {
    width: 100%;
    height: 400px;
    background-color: grey;
}

以下是有關如何創建地圖的鏈接： https : //developers.google.com/maps/documentation/javascript/adding-a-google-map

祝你好運，編碼愉快:)