地図 ID を使用する

地図 ID は、Google Cloud Console で作成し、スタイルと関連付ける識別子で、アプリコードに格納され、そのスタイルを地図に適用します。

マップ ID は、作成時にプロジェクトに関連付けられ、単一のプラットフォーム(Android、iOS、JavaScript)または Maps Static API に限定されます。

Cloud Console でマップ ID を作成または管理するには、プロジェクト所有者またはプロジェクト編集者の IAM の役割が必要です。

マップ ID を作成する

マップ ID は、Google マップの 1 つのインスタンスを表す一意の識別子です。マップ ID の作成と、マップ ID に関連付けられたスタイルの更新は、Cloud Console でいつでも行えます。

マップ ID の作成方法:

  1. Cloud Console で、[マップ管理] ページに移動します。
  2. [新しいマップ ID を作成] を選択して、[新しいマップ ID を作成] フォームを表示します。
    新しいマップ ID の作成

    フォーム内で次の操作を行います。

    • 地図の名前を指定します。
    • 地図の種類またはプラットフォームを指定します。
    • JavaScript マップの場合は、ラスターマップまたはベクターマップを選択します。
    • 地図の説明文を入力します。
    • [次へ] を選択して、新しいマップ ID を表示します。

マップ ID を地図のスタイルに関連付ける

以下の手順は、プロジェクトに既存の地図のスタイルが少なくとも 1 つあることを前提としています。

  1. Cloud Console で、[マップ管理] ページに移動します。
  2. このページの [地図の名前] 列から既存のマップ ID を選択します。
  3. このフォームの下部の [このマップ ID に関連付けられた地図のスタイル] プルダウンから地図のスタイルを選択します。
  4. [保存] を選択します。
    地図のスタイルをこのマップ ID に関連付けるためのプルダウン フィールドなど、1 つのマップ ID の詳細ページを示すスクリーンショット。

地図 ID をアプリに追加する

アプリケーション コードで地図 ID を使用して地図を作成する手順は次のとおりです。

  1. 埋め込み JSON コードを使用して地図をカスタマイズしている場合は、MapOptions オブジェクトから styles プロパティを削除します。それ以外の場合は、この手順は省略してください。

  2. mapId プロパティを使用して、地図 ID を地図に追加します。例は次のとおりです。

map = new google.maps.Map(document.getElementById('map'), {
center: {lat: -34.397, lng: 150.644},
zoom: 8,
mapId: 'MAP_ID'
});