Ikony miejsca wskazują różne rodzaje miejsc (np. kawiarnie, biblioteki i muzea). Możesz zamówić ikony i ich kolory tła, korzystając z klasy miejsc lub usługi Places.
Pola
W przypadku ikon miejsca korzystaj z tych pól:
Pole | Klasa miejsca | Usługa Miejsca |
---|---|---|
Ikona | --- | icon |
Kolor tła ikony | iconBackgroundColor |
icon_background_color |
Identyfikator URI maski ikony | svgIconMaskURI |
icon_mask_base_uri |
icon
zwraca adres URL ikony PNG o wymiarach 71 x 71 pikseli (tylko w usłudze Miejsca).iconBackgroundColor
iicon_background_color
zwraca domyślny szesnastkowy kod koloru kategorii ikony miejsca.icon_mask_base_uri
(Usługa Miejsc) zwraca podstawowy adres URL dla ikony bezkolorowej i pomniejsz ją o rozszerzenie typu pliku (dołącza.svg
lub.png
).svgIconMaskURI
(klasa miejsca) zwraca podstawowy adres URL ikony SVG bez koloru.
Zastosuj kolor i ikonę miejsca do znacznika
Szczegóły miejsca umożliwiają żądanie ikony miejsca i koloru tła, które możesz zastosować do znaczników. Poniższy przykład pokazuje kod do utworzenia znacznika na podstawie danych o miejscu poprzez przekazanie właściwości place.iconBackgroundColor
do opcji PinElement.background
i place.svgIconMaskURI
do PinElement.glyph
. Użyj place.location
, aby umieścić znacznik we właściwym miejscu. W tym przykładzie w tytule znacznika wyświetla się też place.displayName
.
TypeScript
// A marker customized using a place icon and color, name, and geometry. const place = new Place({ id: 'ChIJN5Nz71W3j4ARhx5bwpTQEGg', }); // Call fetchFields, passing the desired data fields. await place.fetchFields({ fields: ['location', 'displayName', 'svgIconMaskURI', 'iconBackgroundColor'] }); const pinElement = new PinElement({ background: place.iconBackgroundColor, glyph: new URL(String(place.svgIconMaskURI)), }); const placeIconMarkerView = new AdvancedMarkerElement({ map, position: place.location, content: pinElement.element, title: place.displayName, });
JavaScript
// A marker customized using a place icon and color, name, and geometry. const place = new Place({ id: "ChIJN5Nz71W3j4ARhx5bwpTQEGg", }); // Call fetchFields, passing the desired data fields. await place.fetchFields({ fields: [ "location", "displayName", "svgIconMaskURI", "iconBackgroundColor", ], }); const pinElement = new PinElement({ background: place.iconBackgroundColor, glyph: new URL(String(place.svgIconMaskURI)), }); const placeIconMarkerView = new AdvancedMarkerElement({ map, position: place.location, content: pinElement.element, title: place.displayName, });
Prośby o kolor ikony i tła
W tabelach poniżej znajdziesz wszystkie dostępne ikony miejsc według kategorii. Domyślnie są one wyświetlane z czarnym glifem. Kolor tła ikony jest określany na podstawie kategorii miejsca.
Kategoria miejsca: Jedzenie i napoje (kolor tła ikony #FF9E67) |
|||
---|---|---|---|
Bar, Klub nocny |
Kawiarnia |
Restauracja, piekarnia |
|
Kategoria miejsca: handel detaliczny (kolor tła ikony #4B96F3) |
|||
Książki, odzież, elektronika, biżuteria, buty, centrum handlowe |
Sklep wielobranżowy |
Sklep spożywczy, supermarket |
Apteka |
Kategoria miejsca: usługi (kolor tła ikony #909CE1) |
|||
Bankomat |
Bank |
Gaz |
Zakwaterowanie |
Poczta |
|||
Kategoria miejsca: Rozrywka (kolor tła ikony #13B5C7) |
|||
Oceanarium, Turysta |
Golf |
Historyczne |
Film |
Muzeum |
Kino |
||
Kategoria miejsca: Transport (kolor tła ikony #10BDFF) |
|||
Lotnisko |
Autobus, wspólne przejazdy, taksówka |
Pociąg |
|
Kategoria miejsca: Miejskie/ogólne/religijne (icon background color #7B9EB0) |
|||
Cmentarz |
Budynek miejski |
Biblioteka |
Pomnik |
Parking |
Szkoła (szkoła podstawowa, średnia, uczelnia wyższa) |
Modlitwa (chrześcijanin) |
|
Uwielbienie (hinduskie) |
Uwielbienie (islam) |
Wiedza (Jain) |
Oddawanie czci (żydów) |
Oddawanie czci (sikhów) |
Typowa firma |
||
Kategoria miejsca: Na zewnątrz (icon background color #4DB546) |
|||
Pływanie łodzią |
Kemping |
Park |
Stadion |
Zoo |
|||
Kategoria miejsca: alarmowe (kolor tła ikony #F88181) |
|||
Szpital |
Policja |