您已全部設定完成!

若要開始開發,請參閱我們的開發人員文件

啟用 Google Maps JavaScript API

為協助您開始,我們將先引導您使用「Google 開發人員控制台」來執行一些動作:

  1. 建立或選擇專案
  2. 啟用 Google Maps JavaScript API 與相關服務
  3. 建立適當的金鑰
繼續

概念

針對行動裝置開發

Google Maps JavaScript API 經過特別設計,能在行動裝置上快速載入且順利運作。我們特別針對先進的行動裝置(例如 Android 和 iOS 手持式裝置)進行開發。行動裝置的螢幕尺寸多半比電腦中典型的瀏覽器還小。而且通常都有針對這些裝置而設計的特殊行為(例如「捏合縮小」)。如果您希望您的應用程式能在行動裝置上順利運作,我們建議:

  • 將包含地圖的 <div> 的寬度與高度屬性設定為 100%。不過某些舊版的電腦瀏覽器使用這些值無法順利顯示。
  • 您可以檢查 DOM 內的 navigator.userAgent 屬性,偵測 iPhone 和 Android 裝置:
    function detectBrowser() {
      var useragent = navigator.userAgent;
      var mapdiv = document.getElementById("map");
    
      if (useragent.indexOf('iPhone') != -1 || useragent.indexOf('Android') != -1 ) {
        mapdiv.style.width = '100%';
        mapdiv.style.height = '100%';
      } else {
        mapdiv.style.width = '600px';
        mapdiv.style.height = '800px';
      }
    }
    

    這樣您就可以針對特定的裝置改變版面配置,就像我們在這裡針對每個裝置變更螢幕設定一樣。

  • Android 和 iOS 裝置使用下列 <meta> 標記:

    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    

    此設定指定地圖要以全螢幕顯示,而且不能由使用者調整大小。請注意,iPhone 的 Safari 瀏覽器在頁面的 <head> 元素內需有此 <meta> 標記。

如需有關針對 iPhone 開發的更多資訊,請參閱 Apple 的開發人員文件。如需有關針對 Android 裝置開發的更多資訊,請參閱 Android 文件

當地語系化

您可以透過變更預設語言設定並指定地區代碼,以將您的 Google Maps JavaScript API 應用程式當地語系化,這會根據指定的國家或領土更改地圖的行為。如需詳細資訊,請參閱將地圖當地語系化

版本控制

Google Maps JavaScript API 團隊會定期更新 API,以加入新功能、修復錯誤以及改善效能。您可以在 Google Maps JavaScript API 啟動要求的 v 參數指定您的應用程式中要載入哪個版本的 API。深入瞭解版本控制

傳送您對下列選項的寶貴意見...

這個網頁
Google Maps JavaScript API
Google Maps JavaScript API
需要協助嗎?請前往我們的支援網頁