Ikon tempat menunjukkan berbagai jenis tempat (misalnya kedai kopi,
perpustakaan, dan museum). Anda dapat meminta URL untuk ikon dalam format PNG atau SVG, serta warna latar belakang ikon yang sesuai, dengan permintaan Find Place, Place Details, Nearby Search, dan Text Search. Ikon dapat digunakan secara inline.
Setiap ikon ditentukan oleh dua kolom respons:
URI dasar ikon berisi URL dasar untuk ikon tidak berwarna, tanpa ekstensi jenis file. Anda harus menambahkan .svg atau
.png ke URI untuk meminta ikon.
Warna latar belakang ikon berisi kode warna HEX default untuk kategori tempat.
Contoh
Contoh berikut menunjukkan cara meminta URI ikon dan warna latar belakang untuk
Places API (Baru) dan Places API (Lama). Perhatikan bahwa permintaan dan responsnya berbeda
untuk dua versi API.
Places API (Baru)
Contoh berikut menggunakan
Text Search (New)
untuk menampilkan nama tampilan tempat serta kolom respons iconMaskBaseUri dan
iconBackgroundColor:
{"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 (Lama)
Contoh berikut menunjukkan permintaan Find Place (Lama) yang menyertakan kolom icon_mask_base_uri dan icon_background_color:
Untuk menampilkan ikon, tambahkan ekstensi jenis file (.png atau .svg) yang Anda inginkan ke URI ikon
yang ditampilkan, dan gabungkan ikon dengan warna latar belakang yang ditampilkan. Misalnya, untuk menampilkan ikon .svg
di halaman web:
Tabel berikut menampilkan semua ikon tempat yang tersedia menurut kategori. Secara default, ikon tempat ini ditampilkan dengan glyph hitam. Warna latar belakang ikon ditentukan berdasarkan kategori tempat.
Kategori tempat: Makanan dan minuman (warna latar belakang ikon #FF9E67)
Bar, Klub malam
Kafe
Restoran, Toko Roti
Kategori tempat: Retail (warna latar belakang ikon #4B96F3)
Buku, Pakaian, Elektronik, Perhiasan, Sepatu, Pusat Perbelanjaan/Mall
Minimarket
Toko Bahan Makanan, Supermarket
Apotek
Kategori tempat: Layanan (warna latar belakang ikon #909CE1)
ATM
Bank
SPBU
Penginapan
Kantor pos
Kategori tempat: Hiburan (warna latar belakang ikon #13B5C7)
Akuarium, Wisatawan
Golf
Bersejarah
Film
Museum
Teater
Kategori tempat: Transportasi (warna latar belakang ikon #10BDFF)
Bandara
Bus, transportasi online, taksi
Kereta/Transportasi Rel
Kategori tempat: Kota/generik/agama (warna latar belakang ikon #7B9EB0)
Pemakaman
Bangunan sipil
Perpustakaan
Monumen
Parkir
Sekolah (dasar, menengah, universitas)
Ibadah (Kristen)
Ibadah (Hindu)
Ibadah (Islam)
Ibadah (Jain)
Ibadah (Yahudi)
Ibadah (Sikh)
Bisnis generik
Kategori tempat: Luar Ruangan (warna latar belakang ikon #4DB546)
Naik perahu
Berkemah
Taman
Stadion
Kebun binatang
Kategori tempat: Darurat (warna latar belakang ikon #F88181)
[null,null,["Terakhir diperbarui pada 2025-08-31 UTC."],[[["\u003cp\u003ePlace icons, available in PNG or SVG formats, visually represent various place types like restaurants and libraries, and can be requested using Find Place, Place Details, Nearby Search, and Text Search requests.\u003c/p\u003e\n"],["\u003cp\u003eEach icon is identified by an icon base URI (requiring \u003ccode\u003e.svg\u003c/code\u003e or \u003ccode\u003e.png\u003c/code\u003e appended for the full URL) and an icon background color, represented by a HEX color code.\u003c/p\u003e\n"],["\u003cp\u003eWhile the older Places API uses \u003ccode\u003eicon\u003c/code\u003e, \u003ccode\u003eicon_mask_base_uri\u003c/code\u003e, and \u003ccode\u003eicon_background_color\u003c/code\u003e fields, the new Places API uses \u003ccode\u003eiconMaskBaseUri\u003c/code\u003e and \u003ccode\u003eiconBackgroundColor\u003c/code\u003e.\u003c/p\u003e\n"],["\u003cp\u003eTo display an icon, combine the icon base URI with the desired file type extension and apply the icon background color as the background of the image element.\u003c/p\u003e\n"],["\u003cp\u003ePlace icons are categorized, such as Food and drink or Tourist, with each category having a specific background color.\u003c/p\u003e\n"]]],[],null,["# Place Icons\n\nSelect platform: [Android](/maps/documentation/places/android-sdk/icons \"View this page for the Android platform docs.\") [iOS](/maps/documentation/places/ios-sdk/icons \"View this page for the iOS platform docs.\") [JavaScript](/maps/documentation/javascript/place-icons \"View this page for the JavaScript platform docs.\") [Web Service](/maps/documentation/places/web-service/icons \"View this page for the Web Service platform docs.\") \n**European Economic Area (EEA) developers** If your billing address is in the European Economic Area, effective on 8 July 2025, the [Google Maps Platform EEA Terms of Service](https://cloud.google.com/terms/maps-platform/eea) will apply to your use of the Services. Functionality varies by region. [Learn more](/maps/comms/eea/faq).\n\nIntroduction\n------------\n\nPlace icons indicate the various types of places (for example coffee shops,\nlibraries, and museums). You can request URLs for icons in PNG or SVG format,\nas well as the corresponding icon background color, with Find Place,\nPlace Details, Nearby Search, and Text Search requests. Icons can be used inline.\n\nEach icon is defined by two response fields:\n\n- The **icon base URI** contains the base URL for a non-colored icon, minus the file type extension. You must append `.svg` or `.png` to the URI to request the icon.\n- The **icon background color** contains the default HEX color code for the place's category.\n\n| Icon URLs may change, so be sure to always use **icon base URI** to look up the URL for an icon. Places API (Legacy) supports the `icon` response field. Don't use `icon` field but instead use `icon_background_color` and `icon_mask_base_uri` with Places API (Legacy).\n\nExample\n-------\n\nThe following examples show how to request an icon URI and background color for\nPlaces API (New) and Places API (Legacy). Notice that the request and responses are different\nfor the two versions of the API. \n\n### Places API (New)\n\nThe following example uses\n[Text Search (New)](/maps/documentation/places/web-service/text-search)\nto return the display name of a place as well as the `iconMaskBaseUri` and\n`iconBackgroundColor` response fields: \n\n```curl\ncurl -X POST -d '{\n \"textQuery\" : \"skog haus\",\n \"maxResultCount\" : 1\n}' \\\n-H 'Content-Type: application/json' -H 'X-Goog-Api-Key: API_KEY' \\\n-H 'X-Goog-FieldMask: places.displayName,places.iconMaskBaseUri,places.iconBackgroundColor' \\\n'https://places.googleapis.com/v1/places:searchText'\n```\n\nThe response is in the form: \n\n```json\n{\n \"places\": [\n {\n \"iconMaskBaseUri\": \"https://maps.gstatic.com/mapfiles/place_api/icons/v2/cafe_pinlet\",\n \"iconBackgroundColor\": \"#FF9E67\",\n \"displayName\": {\n \"text\": \"SKÖG Haus Coffee & Tea\",\n \"languageCode\": \"en\"\n }\n }\n ]\n}\n```\n\n### Places API (Legacy)\n\nThe following example shows a\n[Find Place (Legacy)](/maps/documentation/places/web-service/search#FindPlaceRequests) request\nwhich includes the `icon_mask_base_uri` and `icon_background_color`\nfields: \n\n```carbon\n https://maps.googleapis.com/maps/api/place/findplacefromtext/json?input=skog%20haus&inputtype=textquery&fields=name,icon_mask_base_uri,icon_background_color&key=\u003cvar translate=\"no\"\u003eAPI_KEY\u003c/var\u003e\n```\n\nThe following example shows how the `icon_mask_base_uri` and\n`icon_background_color` fields appear in a response from a Find Place (Legacy)\nrequest. \n\n### JSON\n\n```json\n {\n \"candidates\" : [\n {\n \"icon_background_color\" : \"#FF9E67\",\n \"icon_mask_base_uri\" : \"https://maps.gstatic.com/mapfiles/place_api/icons/v2/cafe_pinlet\",\n \"name\" : \"SKÖG Haus Coffee\",\n }\n ],\n \"status\" : \"OK\"\n }\n \n```\n\n### XML\n\n```xml\n \u003cFindPlaceFromTextResponse\u003e\n \u003ccandidates\u003e\n \u003cname\u003eSKÖG Haus Coffee\u003c/name\u003e\n \u003cicon_background_color\u003e#FF9E67\u003c/icon_background_color\u003e\n \u003cicon_mask_base_uri\u003ehttps://maps.gstatic.com/mapfiles/place_api/icons/v2/cafe_pinlet\u003c/icon_mask_base_uri\u003e\n \u003c/candidates\u003e\n \u003cstatus\u003eOK\u003c/status\u003e\n \u003c/FindPlaceFromTextResponse\u003e\n \n```\n\nTo display an icon, append the file type extension (.png or .svg) you want to the returned icon\nURI, and combine the icon with the returned background color. For example, to display the .svg icon\non a web page: \n\n```html\n\u003cstyle\u003e\n .icons-food-drink {\n background-color: #ff9e67;\n width: 88px;\n height: 88px;\n padding: 5px;\n }\n\u003c/style\u003e\n\n\u003cimg src=\"https://maps.gstatic.com/mapfiles/place_api/icons/v2/cafe_pinlet.svg\" alt=\"Cafe\" class=\"icons-food-drink\"/\u003e\n```\n\nPlace icon and background color requests\n----------------------------------------\n\nThe following tables show all of the available place icons by category. By\ndefault these display with a black glyph. The icon background color\nis dictated by the place's category.\n\n| **Place category: Food and drink** (icon background color #FF9E67) ||||\n|--------------------------------------------------------------------|-----------------------------------------|----------------------|------------------|\n| Bar, Night club | Cafe | Restaurant, Bakery |\n| Books, Clothing, Electronics, Jewelry, Shoes, Shopping center/Mall | Convenience store | Grocery, Supermarket | Pharmacy |\n| ATM | Bank | Gas | Lodging |\n| Post office |\n| Aquarium, Tourist | Golf | Historic | Movie |\n| Museum | Theater |\n| Airport | Bus, rideshare, taxi | Train/Rail |\n| Cemetery | Civic building | Library | Monument |\n| Parking | School (primary, secondary, university) | Worship (Christian) |\n| Worship (Hindu) | Worship (Islam) | Worship (Jain) | Worship (Jewish) |\n| Worship (Sikh) | Generic business |\n| Boating | Camping | Park | Stadium |\n| Zoo |\n| Hospital | Police |"]]
