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 Maps JavaScript abilitata. Per saperne di più, consulta Configurare il progetto Google Cloud.
Crea 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 l'opzione Vettore o Raster.
Aggiorna il codice di inizializzazione della mappa
È necessario l'ID mappa che hai appena creato. È disponibile nella pagina Gestione di Maps.
Carica la raccolta degli indicatori avanzati da una funzione
async
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, gli indicatori avanzati non possono essere caricati. Come passaggio per la risoluzione dei problemi, puoi aggiungere un listener mapcapabilities_changed
per la sottoscrizione alle modifiche delle funzionalità della mappa. L'utilizzo delle funzionalità mappa è facoltativo e consigliato solo per scopi di test e risoluzione dei problemi o per scopi di riserva del 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. } });