Segui questi passaggi per iniziare a utilizzare gli indicatori avanzati.
Ottieni una chiave API e attiva l'API Maps JavaScript
Per utilizzare gli indicatori avanzati, è necessario disporre di un progetto con un account di fatturazione e l'API Maps JavaScript in un bucket in cui è abilitato il controllo delle versioni. Per saperne di più, consulta Configurare il progetto Google Cloud.
Crea un ID mappa
Per creare un nuovo ID mappa, segui la procedura descritta in Personalizzazione del cloud. Imposta il tipo di mappa su JavaScript e seleziona Vettore o Opzione Raster.
Aggiorna il codice di inizializzazione della mappa
È necessario l'ID mappa che hai appena creato. È disponibile su Maps Gestione.
Carica la raccolta degli indicatori avanzati dall'interno di un
async
funzione quando necessario:const { AdvancedMarkerElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary;
Fornisci un ID mappa quando crei un'istanza della mappa utilizzando la proprietà
mapId
. Può essere un ID mappa da te fornito oppureDEMO_MAP_ID
.const map = new google.maps.Map(document.getElementById('map'), { center: {lat: -34.397, lng: 150.644}, zoom: 8, mapId: 'YOUR_MAP_ID' });
(Facoltativo) Controlla le funzionalità della mappa
Gli indicatori avanzati richiedono un ID mappa. Se manca l'ID mappa:
impossibile caricare gli indicatori avanzati. Come passaggio per la risoluzione dei problemi,
puoi aggiungere un listener mapcapabilities_changed
per iscriverti alla funzionalità di mappa
modifiche. L'utilizzo delle funzionalità mappa è facoltativo e consigliato solo per i test
per la risoluzione dei problemi
o per il fallback di runtime.
// Optional: subscribe to map capability changes. map.addListener('mapcapabilities_changed', () => { const mapCapabilities = map.getMapCapabilities(); if (!mapCapabilities.isAdvancedMarkersAvailable) { // Advanced markers are *not* available, add a fallback. } });