Le icone dei luoghi indicano i vari tipi di luoghi (ad esempio caffetterie, biblioteche e musei). Puoi richiedere le icone e i relativi colori di sfondo utilizzando la classe Place o il servizio Places.
Campi
Utilizza i campi seguenti per lavorare con le icone dei luoghi:
Campo | Classe del luogo | Servizio Places |
---|---|---|
Icona | --- | icon |
Colore sfondo icona | iconBackgroundColor |
icon_background_color |
URI maschera icona | svgIconMaskURI |
icon_mask_base_uri |
icon
restituisce l'URL di un'icona PNG colorata da 71 x 71 px (solo servizio Places).iconBackgroundColor
eicon_background_color
restituiscono il codice colore esadecimale predefinito per la categoria dell'icona del luogo.icon_mask_base_uri
(servizio Places) restituisce l'URL di base di un'icona non colorata, meno l'estensione del tipo di file (aggiungi.svg
o.png
).svgIconMaskURI
(Classe Place) restituisce l'URL di base di un'icona SVG non colorata.
Applica l'icona e il colore di un luogo a un indicatore
Con Dettagli luogo, puoi richiedere un'icona del luogo e un colore di sfondo da applicare agli indicatori. L'esempio seguente mostra il codice per creare un indicatore utilizzando i dati sui luoghi passando
place.iconBackgroundColor
all'opzione PinElement.background
e
place.svgIconMaskURI
a PinElement.glyph
. Utilizza place.location
per posizionare l'indicatore nella posizione corretta. Questo esempio mostra anche place.displayName
nel titolo dell'indicatore.
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, });
Richieste di colore sfondo e icona del luogo
Le seguenti tabelle mostrano tutte le icone dei luoghi disponibili per categoria. Per impostazione predefinita, vengono visualizzate con un glifo nero. Il colore di sfondo dell'icona è determinato dalla categoria del luogo.
Categoria del luogo: Cibi e bevande (colore sfondo icona #FF9E67) |
|||
---|---|---|---|
Bar, Discoteca |
Bar |
Ristorante, panetteria |
|
Categoria luogo: Vendita al dettaglio (colore sfondo icona #4B96F3) |
|||
Libri, abbigliamento, elettronica, gioielli, scarpe, centro commerciale/centro commerciale |
Minimarket |
Alimentari, supermercato |
Farmacia |
Categoria luogo: Servizi (colore sfondo icona #909CE1) |
|||
bancomat |
Banca |
Benzina |
Alloggio |
Ufficio postale |
|||
Categoria luogo: Intrattenimento (colore sfondo icona #13B5C7) |
|||
Acquario, turistico |
Golf |
Storico |
Film |
Museo |
Cinema |
||
Categoria luogo: Trasporti (colore sfondo icona #10BDFF) |
|||
Aeroporto |
Autobus, ridesharing, taxi |
Treno/ferrovia |
|
Categoria luogo: municipale/generico/religioso (colore sfondo icona #7B9EB0) |
|||
Cimitero |
Edificio pubblico |
Raccolta |
Monumento |
Parcheggio |
Scuola (primaria, secondaria, università) |
Culto (cristiano) |
|
Adorazione (indù) |
Adorazione (islam) |
Adorazione (Giain) |
Adorazione (ebraica) |
Culto (sikh) |
Attività generica |
||
Categoria luogo: Esterno (colore sfondo icona #4DB546) |
|||
In barca |
Campeggio |
Parco |
Stadio |
Zoo |
|||
Categoria luogo: Emergenza (colore sfondo icona #F88181) |
|||
Ospedale |
Polizia |