什麼是 Google Maps？
Google Maps 是一個 Google API
Google Fonts 是一個 Google API
Google Charts 是一個 Google API
學習如何將 Google Maps 新增到您的網頁。
我的第一個 Google Map
從一個簡單的網頁開始。
新增一個 <div> 元素，您希望地圖顯示的位置，並設定地圖的大小
示例
<!DOCTYPE html>
<html>
<body>
<h1>我的第一個 Google 地圖</h1>
<div id="map" style="width:100%;height:400px;">我的地圖將顯示在這裡</div>
</body>
<html>
新增一個 JavaScript 函式來顯示地圖
示例
function myMap() {
var mapCanvas = document.getElementById("map");
var mapOptions = {
center: new google.maps.LatLng(51.5, -0.2),
zoom: 10
};
var map = new google.maps.Map(mapCanvas, mapOptions);
}
mapCanvas 變數是地圖的 HTML 元素。
mapOptions 變數定義了地圖的屬性。
center 屬性指定了地圖的中心點（使用緯度和經度座標）。
zoom 屬性指定了地圖的縮放級別（嘗試實驗縮放級別）。
google.maps.Map 物件是使用 mapCanvas 和 mapOptions 作為引數建立的。
最後新增 Google API
地圖的功能由位於 Google 的 JavaScript 庫提供
示例
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY&callback=myMap"></script>
自己動手試一試 »
Google Maps 教程
在我們的 Google Maps 教程 中瞭解更多關於 Google Maps 的資訊。
