將地圖遷移至 LocalContextMapView

如要遷移目前已導入的 Maps JavaScript API 以使用當地特色資料庫，請按照下列步驟操作：

  1. 建立 LocalContextMapView 執行個體，並使用該執行個體存取內部 Map。
  2. 更新 script 標記以加入 libraries=localContext 和 v=beta 參數。
  3. 移除舊的 google.maps.Map 宣告
  4. 合併自訂地圖樣式與當地特色地圖樣式。如果您尚未定義任何自訂地圖樣式，可以略過這個步驟。

目前的 Maps JavaScript API 程式碼可能如下所示：

const map = new google.maps.Map(
  document.querySelector('#map-container'),
  /* map options */
);

如要遷移至當地特色資料庫，請將先前的程式碼換成以下程式碼：

// Create a new LocalContextMapView instance.
const localContextMapView = new google.maps.localContext.LocalContextMapView({
  element: document.querySelector('#map-container'),
  placeTypePreferences: ['restaurant', 'cafe'],
  maxPlaceCount: 12,
});

// Access the inner map and set map options.
const map = localContextMapView.map;
map.setOptions(/* map options */);

更新 script 標記以加入 libraries=localContext 和 v=beta 參數：

<script src="https://maps.googleapis.com/maps/api/js?
  libraries=localContext&
  v=beta&
  key=YOUR_API_KEY&
  callback=initMap"
  async>
</script>

如果您已定義自訂樣式，則必須將這些樣式與當地特色資料庫地圖樣式合併。瞭解詳情。