Cloud ベースのマップのスタイル設定

プラットフォームを選択: Android iOS JavaScript ウェブサービス

Google Maps Platform では、Cloud ベースのマップのスタイル設定を提供しています。この機能により、Google Cloud コンソールを使用した地図のスタイル設定、カスタマイズ、管理が容易になり、スタイルを変更するたびにアプリのコードを更新する必要なく、パーソナライズされた地図のユーザー エクスペリエンスを作り出せます。

2020 年 9 月 15 日より前に作成されたスタイルについては、Google マップの地形描写の拡張が適用されません。Google マップの地形描写の拡張を地図のスタイルに適用するには、地図のスタイルを作成する必要があります。

Cloud ベースのマップのスタイル設定では、マップ ID を設定すると、コードを一切変更することなく、Google マップを使用するすべてのアプリ上で地図のスタイルを定義、編集できます。 すべてのスタイルの変更は Cloud コンソールで行えます。コーディング スキルは必要ありません。道路、建物、水域、スポット、交通機関のルートなど、多くの地図要素の外観や色を変更できます。

主な機能は次のとおりです。

  • Cloud ベースのマップのスタイル設定: JSON を使って地図のスタイル設定をコーディングする代わりに、マップ ID と地図のスタイルを使って Google Cloud コンソールの動的地図と静的地図の管理およびスタイル設定を行うことができます。
  • お店やサービスのフィルタリング: 必要に応じて 5 つのカテゴリのお店やサービスを地図上で非表示にできます。
  • スポットの密度制御: スポットの密度を調整して、デフォルトで基本地図に表示されるスポットを増やしたり減らしたりできます。

Cloud ベースのマップのスタイル設定は、Maps SDK for Android1、Maps SDK for iOS、JavaScript、Maps Static API で利用可能ですが、すべてのプラットフォームですべての対象物が表示されるわけではありません。

始める前に

  • マップ ID を作成する
    Cloud ベースのマップのスタイル設定を使用するには、マップ ID を使用して地図を読み込む必要があります。
  • ハードコードされたスタイルから移行する
    マップ ID を追加する前に、ハードコードされたスタイル設定（JSON または URL クエリ パラメータなど）でカスタマイズした既存の地図で Cloud ベースの地図のスタイル設定を使用するには、ハードコードされたスタイル設定を解除して、将来の機能との競合が発生しないようにすることをおすすめします。JSON スタイルを新しい地図のスタイルにインポートできます。

お支払い

Cloud ベースのマップのスタイル設定を使用するには、マップ ID が必要です。Maps SDK for Android、Maps SDK for iOS、JavaScript では、マップ ID を使用すると Dynamic Maps SKU に対する課金が発生します。Maps Static API では、マップ ID を使用すると Static Maps SKU に対する課金が発生します。

例

マップ ID は、特定の地図のスタイルまたは対象物に関連付けられた識別子です。Google Cloud Console で地図のスタイルを設定してマップ ID に関連付け、コード内でマップ ID を参照すると、関連するマップスタイルがアプリに表示されます。以降に行われるスタイルの更新が自動的にアプリに反映されるため、ユーザー自らが更新する必要がなくなります。

  1. style パラメータでカスタマイズした既存の地図で Cloud ベースのマップのスタイル設定を使用している場合は、将来の機能の競合を避けるため、既存のマップのスタイル設定を削除してください。

  2. Google のウェブ API のいずれかを使用する新規または既存の地図にマップ ID を追加するには、map_id URL パラメータを追加し、地図 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" />

  1. Cloud ベースのマップのスタイル設定は、Android のライトモードではご利用いただけません。 ↩