Questa pagina mostra come ottenere una chiave API, abilitare le API richieste e caricare la libreria Places per poter utilizzare la classe Place.
Ottieni una chiave API e abilita le API richieste
Prima di utilizzare la classe Place, devi:
- Crea un progetto Cloud con un account di fatturazione.
- Ottieni una chiave API.
- Abilita le seguenti API:
- API Maps JavaScript
- API Places
- API Places (nuova) (obbligatoria per utilizzare la ricerca di testo (nuova))
Per scoprire di più, vedi Configurare il progetto Google Cloud.
Ottieni una chiave APICaricare la libreria Places
Per caricare la libreria Places, carica prima l'API Maps JavaScript aggiungendo il caricatore di bootstrap in linea al codice dell'applicazione, come mostrato nello snippet seguente:
<script> (g=>{var h,a,k,p="The Google Maps JavaScript API",c="google",l="importLibrary",q="__ib__",m=document,b=window;b=b[c]||(b[c]={});var d=b.maps||(b.maps={}),r=new Set,e=new URLSearchParams,u=()=>h||(h=new Promise(async(f,n)=>{await (a=m.createElement("script"));e.set("libraries",[...r]+"");for(k in g)e.set(k.replace(/[A-Z]/g,t=>"_"+t[0].toLowerCase()),g[k]);e.set("callback",c+".maps."+q);a.src=`https://maps.${c}apis.com/maps/api/js?`+e;d[q]=f;a.onerror=()=>h=n(Error(p+" could not load."));a.nonce=m.querySelector("script[nonce]")?.nonce||"";m.head.append(a)}));d[l]?console.warn(p+" only loads once. Ignoring:",g):d[l]=(f,...n)=>r.add(f)&&u().then(()=>d[l](f,...n))})({ key: "YOUR_API_KEY", v: "weekly", // Use the 'v' parameter to indicate the version to use (weekly, beta, alpha, etc.). // Add other bootstrap parameters as needed, using camel case. }); </script>
Quindi, utilizza l'operatore await
per chiamare importLibrary()
all'interno di una funzione async
, come mostrato di seguito:
const {Place} = await google.maps.importLibrary("places");