プレイス アイコン

プラットフォームを選択: Android iOS JavaScript ウェブサービス
欧州経済領域（EEA）のデベロッパー

はじめに

さまざまな種類の場所（コーヒー ショップ、図書館、美術館など）を表す場所アイコンがあります。Find Place、Place Details、Nearby Search、Text Search リクエストを使用して、PNG または SVG 形式のアイコンの URL と、対応するアイコンの背景色をリクエストできます。アイコンはインラインで使用できます。

各アイコンは、次の 2 つのレスポンス フィールドで定義されます。

  • アイコンのベース URI には、色付きでないアイコンのベース URL から、ファイル形式の拡張子を除いた値が含まれます。アイコンをリクエストするには、URI に .svg または .png を追加する必要があります。
  • アイコンの背景色には、場所のカテゴリのデフォルトの 16 進数色コードが含まれます。

例

次の例は、Places API（新規）と Places API（従来）のアイコン URI と背景色をリクエストする方法を示しています。2 つのバージョンの API では、リクエストとレスポンスが異なります。

Places API（新規）

次の例では、テキスト検索（新版）を使用して、場所の表示名と iconMaskBaseUri レスポンス フィールドと iconBackgroundColor レスポンス フィールドを返します。

curl -X POST -d '{
  "textQuery" : "skog haus",
  "maxResultCount" : 1
}' \
-H 'Content-Type: application/json' -H 'X-Goog-Api-Key: API_KEY' \
-H 'X-Goog-FieldMask: places.displayName,places.iconMaskBaseUri,places.iconBackgroundColor' \
'https://places.googleapis.com/v1/places:searchText'

レスポンスの形式は次のとおりです。

{
  "places": [
    {
      "iconMaskBaseUri": "https://maps.gstatic.com/mapfiles/place_api/icons/v2/cafe_pinlet",
      "iconBackgroundColor": "#FF9E67",
      "displayName": {
        "text": "SKÖG Haus Coffee & Tea",
        "languageCode": "en"
      }
    }
  ]
}

Places API（以前のバージョン）

次の例は、icon_mask_base_uri フィールドと icon_background_color フィールドを含む Find Place（従来版）リクエストを示しています。

    https://maps.googleapis.com/maps/api/place/findplacefromtext/json?input=skog%20haus&inputtype=textquery&fields=name,icon_mask_base_uri,icon_background_color&key=API_KEY

次の例は、Find Place（従来版）リクエストのレスポンスで、icon_mask_base_uri フィールドと icon_background_color フィールドがどのように表示されるのかを示しています。

JSON

    {
      "candidates" : [
          {
            "icon_background_color" : "#FF9E67",
            "icon_mask_base_uri" : "https://maps.gstatic.com/mapfiles/place_api/icons/v2/cafe_pinlet",
            "name" : "SKÖG Haus Coffee",
          }
      ],
      "status" : "OK"
    }

XML

    <FindPlaceFromTextResponse>
      <candidates>
        <name>SKÖG Haus Coffee</name>
        <icon_background_color>#FF9E67</icon_background_color>
        <icon_mask_base_uri>https://maps.gstatic.com/mapfiles/place_api/icons/v2/cafe_pinlet</icon_mask_base_uri>
      </candidates>
      <status>OK</status>
    </FindPlaceFromTextResponse>

アイコンを表示するには、返されたアイコン URI に目的のファイル形式の拡張子（.png または .svg）を追加し、アイコンを返された背景色と組み合わせます。たとえば、ウェブページに .svg アイコンを表示するには、次のようにします。

<style>
  .icons-food-drink {
    background-color: #ff9e67;
    width: 88px;
    height: 88px;
    padding: 5px;
  }
</style>

<img src="https://maps.gstatic.com/mapfiles/place_api/icons/v2/cafe_pinlet.svg" alt="Cafe" class="icons-food-drink"/>

場所のアイコンと背景色のリクエスト

次の表には、利用可能な場所アイコンがカテゴリ別にまとめられています。デフォルトでは、これらのアイコンは黒いグリフで表示されます。アイコンの背景色は、場所のカテゴリによって指定されます。

場所のカテゴリ: 食品、飲料
（アイコンの背景色 #FF9E67）
バー
バー、
ナイトクラブ 		カフェ
カフェ 		レストラン
レストラン、ベーカリー
場所のカテゴリ: 小売
（アイコンの背景色 #4B96F3）
書店
書籍、衣料品、電化製品、ジュエリー、靴、
ショッピング センター / モール 		コンビニエンス ストア
コンビニエンス ストア 		食料品
食料品店、スーパーマーケット 		薬局
薬局
場所のカテゴリ: サービス
（アイコンの背景色 #909CE1）
ATM
ATM 		銀行
銀行 		ガソリン
ガソリン 		宿泊施設
宿泊施設
郵便局
郵便局
場所のカテゴリ: エンターテインメント
（アイコンの背景色 #13B5C7）
水族館、観光
水族館、観光 		ゴルフ
ゴルフ 		歴史にゆかりがある場所
歴史にゆかりがある場所 		映画
映画
博物館
博物館 		劇場
劇場
場所のカテゴリ: 交通機関
（アイコンの背景色 #10BDFF）
空港
空港 		バス
バス、配車サービス、タクシー 		電車 / 鉄道
電車 / 鉄道
場所のカテゴリ: 公営 / 一般 / 宗教施設
（アイコンの背景色 #7B9EB0）
墓地
墓地 		公民館
公民館 		図書館
図書館 		記念碑
記念碑
駐車場
駐車場 		学校（小学校、中学校、高校、大学）
学校（小学校、中学校、高校、大学） 		礼拝（キリスト教）
礼拝（キリスト教）
礼拝（ヒンズー教）
礼拝（ヒンズー教） 		礼拝（イスラム教）
礼拝（イスラム教） 		礼拝（ジャイナ教）
礼拝（ジャイナ教） 		礼拝（ユダヤ）
礼拝（ユダヤ教）
礼拝（シーク教）
礼拝（シーク教） 		一般的なお店やサービス
一般的なお店やサービス
場所のカテゴリ: アウトドア
（アイコンの背景色 #4DB546）
ボート
ボート 		キャンプ
キャンプ 		公園
公園 		スタジアム
スタジアム
動物園
動物園
場所のカテゴリ: 緊急対応
（アイコンの背景色 #F88181）
病院
病院 		警察
警察