使用地圖 ID
地圖 ID 是指與特定地圖樣式或地圖項目相關聯的 ID。 您可以先設定地圖樣式,並將地圖樣式與 Google Cloud 控制台中的地圖 ID 建立關聯。 這樣一來,當您在程式碼中參照該地圖 ID 時,相關的地圖樣式就會顯示在應用程式中。後續的任何樣式更新也會自動顯示在應用程式中,客戶不需要進行任何更新。
建立地圖 ID 後,地圖 ID 會與專案建立關聯,而且只能用於單一平台 (Android、iOS、JavaScript) 或 Maps Static API。
如要在 Cloud 控制台中建立或管理任何地圖 ID,您必須具備專案擁有者或專案編輯者 IAM 角色。
所需權限
如要在特定 Google Cloud 專案中建立或管理任何地圖 ID 或地圖樣式,您必須擁有專案的「擁有者」或「編輯者」IAM 角色。
建立地圖 ID
「地圖 ID」是不重複的 ID,代表單一 Google 地圖例項。您可隨時在 Cloud 控制台中建立地圖 ID,並更新與地圖 ID 相關聯的樣式。
如要建立地圖 ID,請按照下列步驟操作:
- 前往 Cloud Console 中的「地圖管理」頁面。
- 選取「Create New Map ID」(建立新地圖 ID),系統即會顯示「Create New Map ID」(建立新地圖 ID) 表單。
在表單中執行以下操作:
- 為地圖命名。
- 指定地圖類型或平台。
- 如果是 JavaScript 地圖,請選擇光柵或向量地圖類型。
- 輸入地圖說明。
- 選取「下一步」,即可查看新的地圖 ID。
將地圖 ID 與地圖樣式建立關聯
這些操作說明假設您的專案中目前至少有一個地圖樣式。
- 前往 Cloud Console 中的「地圖管理」頁面。
- 在這個頁面的「地圖名稱」欄中,選取現有的地圖 ID。
- 在這個表單的底部,從 [與這組地圖 ID 相關聯的地圖樣式] 下拉式選單中選擇地圖樣式。
- 選取「Save」(儲存)。
在應用程式中加入地圖 ID
Android
您可以使用 MapView
類別 (或以程式輔助方式使用 GoogleMapOptions
類別),透過活動版面配置檔案中的 <fragment>
元素來新增地圖 ID。
舉例來說,假設您建立了名為 map_id
的地圖 ID,並以字串值形式儲存於 res/values/strings.xml
中:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="map_id">YOUR_MAP_ID</string>
</resources>
如果是透過活動版面配置檔案中的 <fragment>
元素新增的地圖,所有要設定自訂樣式的地圖片段都必須在 map:mapId
屬性中指定地圖 ID:
<fragment xmlns:map="http://schemas.android.com/apk/res-auto"
class="com.google.android.gms.maps.SupportMapFragment"
…
map:mapId="@string/map_id" />
您也可以使用 MapView
類別的 map:mapId
屬性指定地圖 ID:
<com.google.android.gms.maps.MapView
xmlns:android="http://schemas.android.com/apk/res/android"
....
map:mapId="@string/map_id" />
如要透過程式輔助方式指定地圖 ID,請使用 GoogleMapOptions
類別將 ID 傳送至 MapFragment
例項:
Java
MapFragment mapFragment = MapFragment.newInstance(
new GoogleMapOptions()
.mapId(getResources().getString(R.string.map_id)));
Kotlin
val mapFragment = MapFragment.newInstance(
GoogleMapOptions()
.mapId(resources.getString(R.string.map_id))
)
在 Android Studio 中,按照平常的操作方式建構及執行應用程式。在第一個步驟中設定的自訂樣式會套用至所有具備 ID 的地圖。
iOS
如要使用地圖 ID 將地圖例項化,請按照以下指示操作:
- 透過 Cloud 控制台使用地圖 ID 字串建立
GMSMapID
。 - 建立
GMSMapView
,指定您剛建立的地圖 ID。
Swift
let camera = GMSCameraPosition(latitude: 47.0169, longitude: -122.336471, zoom: 12)
let mapID = GMSMapID(identifier: "<YOUR MAP ID>")
let mapView = GMSMapView(frame: .zero, mapID: mapID, camera: camera)
self.view = mapView
Objective-C
GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:47.0169
longitude:-122.336471
zoom:12];
GMSMapID *mapID = [GMSMapID mapIDWithIdentifier:@"<YOUR MAP ID>"];
GMSMapView *mapView = [GMSMapView mapWithFrame:CGRectZero mapID:mapID camera:camera];
self.view = mapView;
如果您使用自己的地圖 ID,隨時可以在 Cloud 控制台中設定地圖 ID 為新樣式,該樣式會在約六小時內,自動套用到您的地圖檢視。
如果您希望立即查看變更,可以關閉並重新啟動應用程式,方法是結束應用程式,強制從最近使用過的應用程式清單中結束該應用程式,然後重新開啟。接著,您就可以看到更新後的地圖。
JavaScript
如何在應用程式的程式碼中使用地圖 ID 建立地圖:
如果您目前使用嵌入式 JSON 程式碼自訂地圖,請從
MapOptions
物件中移除styles
屬性;否則請略過這個步驟。使用
mapId
屬性將地圖 ID 加進地圖。例如:
map = new google.maps.Map(document.getElementById('map'), { center: {lat: -34.397, lng: 150.644}, zoom: 8, mapId: 'MAP_ID' });
靜態地圖介面集
在使用我們網路服務 API 的新或現有地圖中,如要新增地圖 ID,請附加 map_id
網址參數,並將其設為您的地圖 ID。這個範例說明如何使用 Maps Static API,在地圖中加入地圖 ID。
<img src="https://maps.googleapis.com/maps/api/staticmap?center=Brooklyn+Bridge,New+York,NY&zoom=13&size=600x300&maptype=roadmap&markers=color:blue%7Clabel:S%7C40.702147,-74.015794&markers=color:green%7Clabel:G%7C40.711614,-74.012318&markers=color:red%7Clabel:C%7C40.718217,-73.998284&key=YOUR_API_KEY&map_id=YOUR_MAP_ID&signature=YOUR_SIGNATURE" />
使用地圖 ID 時可使用的功能
雲端式地圖樣式設定:使用 Google Cloud 控制台設定地圖樣式,以及自訂及管理地圖。
適用於所有平台 (Android、JavaScript、iOS 和 Maps Static API)
向量地圖:由向量圖塊組成的地圖,這些圖塊會在用戶端的載入時,使用 WebGL 進行繪製。
適用於 JavaScript