地図の LocalContextMapView への移行

Maps JavaScript API の「ローカル コンテキスト ライブラリ」は、ベータ版機能として提供してまいりましたが、導入数が限られていたため、v3.52.2 より非推奨となります。ローカル コンテキスト ライブラリの機能は別途お知らせがあるまでご利用いただけますが、新しいプロジェクトへの追加は推奨されません。

ローカル コンテキスト ライブラリのようなエクスペリエンスの構築に関心をお持ちの方は、Quick Builder の「Neighborhood Discovery」ソリューションを検討されるか、Maps JavaScript API のプレイス ライブラリを活用されることをおすすめします。プレイス ライブラリについては、コード例や Codelab もご用意しています。

このプロダクトまたは機能は、pre-GA（一般提供前）のベータ版です。 pre-GA のプロダクトや機能では、サポートが限定されることがあります。また、pre-GA のプロダクトや機能の変更は、他の pre-GA バージョンと互換性がない場合があります。pre-GA のサービスには、Google Maps Platform Service Specific Terms が適用されます。詳しくは、リリース ステージの説明をご覧ください。

既存の 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>

カスタム スタイルを定義している場合は、そのスタイルをローカル コンテキスト ライブラリの地図スタイルと統合する必要があります。詳細