Segui questi passaggi per iniziare a utilizzare gli indicatori avanzati.
Ottieni una chiave API e attiva l'API Maps JavaScript
Prima di utilizzare gli indicatori avanzati, devi avere un progetto Cloud con un account di fatturazione e l'API JavaScript di Maps attivata. Per saperne di più, vedi Configurare il progetto Google Cloud.
Creare un ID mappa
Per creare un nuovo ID mappa, segui i passaggi descritti in Personalizzazione di Cloud. Imposta il tipo di mappa su JavaScript e seleziona Vettore o Opzione Raster.
Aggiorna il codice di inizializzazione della mappa
Per farlo, devi avere l'ID mappa 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 ne esegui l'inizializzazione utilizzando la proprietà
mapId
. Può essere un ID mappa fornito da te oDEMO_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 l'ID mappa non è presente,
gli indicatori avanzati non possono essere caricati. Come passaggio per la risoluzione dei problemi,
puoi aggiungere un ascoltatore mapcapabilities_changed
per iscriverti alle modifiche delle funzionalità della mappa. 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. } });