地點圖示

選取平台： Android iOS JavaScript 網頁服務
歐洲經濟區 (EEA) 開發人員

簡介

地點圖示會指出不同類型的地點 (例如咖啡店、圖書館和博物館)。您可以使用 Find Place、Place Details、Nearby Search 和 Text Search 要求，取得 PNG 或 SVG 格式的圖示網址，以及對應的圖示背景顏色。圖示可內嵌使用。

每個圖示都由兩個回應欄位定義：

  • 圖示基礎 URI 包含非彩色圖示的基礎網址，刪除檔案類型副檔名。您必須在 URI 中附加 .svg 或 .png，才能要求圖示。
  • 圖示背景顏色包含地點類別的預設十六進位顏色代碼。

範例

以下範例說明如何為 Places API (新版) 和 Places API (舊版) 要求圖示 URI 和背景顏色。請注意，這兩個 API 版本的請求和回應不同。

Places API (新推出)

以下範例使用 Text Search (新版) 傳回地點的顯示名稱，以及 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 (舊版)

以下範例顯示 Find Place (舊版) 要求，其中包含 icon_mask_base_uri 和 icon_background_color 欄位：

    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>

如要顯示圖示，請將所需的檔案類型副檔名 (.png 或 .svg) 附加至傳回的圖示 URI，並將圖示與傳回的背景顏色結合。舉例來說，如要在網頁上顯示 .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)
提款機
提款機 		銀行
銀行 		加油站
加油站 		住宿地點
住宿地點
郵局
郵局
地點類別：娛樂
(圖示背景顏色 #13B5C7)
水族館、觀光旅遊
水族館、觀光旅遊 		高爾夫
高爾夫 		歷史古蹟
歷史古蹟 		電影
電影
博物館
博物館 		劇場
劇場
地點類別：交通運輸
(圖示背景顏色 #10BDFF)
機場
機場 		公車
公車、代僱駕駛服務、計程車 		火車/鐵路
火車/鐵路
地點類別：市政/一般/宗教
(圖示背景顏色 #7B9EB0)
墓園
墓園 		市政建築
市政建築 		圖書館
圖書館 		紀念碑
紀念碑
停車場
停車場 		學校 (小學、中學、大專院校)
學校 (小學、中學、大專院校) 		宗教 (基督教)
宗教 (基督教)
宗教 (印度教)
宗教 (印度教) 		宗教 (伊斯蘭教)
宗教 (伊斯蘭教) 		宗教 (耆那教)
宗教 (耆那教) 		宗教 (猶太教)
宗教 (猶太教)
宗教 (錫克教)
宗教 (錫克教) 		一般業務
一般業務
地點類別：戶外
(圖示背景顏色 #4DB546)
乘船
乘船 		露營
露營 		公園
公園 		體育場館
體育場館
動物園
動物園
地點類別：緊急狀況
(圖示背景顏色 #F88181)
醫院
醫院 		警察局
警察局