Panoramica
Google Maps Platform è disponibile per il web (JS, TS), Android e iOS, e offre anche API di servizi web per ottenere informazioni su luoghi, e distanze. Gli esempi in questa guida sono scritti per una singola piattaforma, ma vengono forniti link alla documentazione per l'implementazione su altre piattaforme.
Builder rapido della console Google Cloud consente di creare rapidamente un locator, inclusa l'importazione Schede di Profilo dell'attività e incorporamento automatico dei link di prenotazione degli appuntamenti da di terze parti. L'interfaccia utente interattiva consente di generare il codice ed eseguirne il deployment Google Cloud in pochi minuti.
I tuoi utenti vogliono cercare prodotti e servizi online per trovare i migliori e più luogo comodo in cui recarvisi, prendere un appuntamento o ritirare un ordine. Vogliono arrivare alla tua posizione il più velocemente possibile e tu vuoi esperienze online ricche che aumentano le visite alle tue sedi fisiche, rafforzare la soddisfazione degli utenti e ridurre le chiamate di assistenza. Inoltre, vuoi misurare il successo del locator per determinare se i clienti possono trovare posizione geografica e vuoi capire dove apportare miglioramenti.
Locator Plus: le indicazioni e i suggerimenti per la personalizzazione che forniamo in di Google Maps: è l'opzione che consigliamo come combinazione ottimale di Google Maps Platform API per creare un'ottima esperienza utente con localizzatore. Seguendo queste prassi, possono aiutare gli utenti a trovare le sedi della tua attività su una mappa, a vedere le informazioni dettagliate che devono fare prendere decisioni e dare loro le indicazioni stradali, sia durante la guida, in bicicletta, a piedi o con i mezzi pubblici.
Per gli utenti di Locator Plus, una dashboard di analisi consente di analizzare e generare approfondimenti dai tuoi dati, offrendoti un'immagine chiara del livello di coinvolgimento dei tuoi acquirenti il tuo Store locator. Per accedere a questo report, vai alla Sezione Report sul coinvolgimento della console. Per ulteriori dettagli su questo report, consulta Report Coinvolgimento.
Il seguente diagramma mostra le API principali coinvolte nell'implementazione di Locator Plus. Il diagramma mostra anche un database dei tuoi dati sulla posizione che puoi combinare con Place Details per offrire agli utenti il set migliore e più completo di informazioni possibili. (Fai clic per ingrandire.)
![Sul lato sinistro del diagramma, un browser web visualizza una mappa con un popup Place Details.
A destra del diagramma, un elenco di API che forniscono funzionalità diverse:
API Maps JavaScript per la visualizzazione e i contenuti della posizione, la personalizzazione delle mappe e la mappa
indicatori, Street View personalizzato e la visualizzazione dei percorsi. Posizionamento automatico del luogo per
il completamento degli indirizzi
e la funzionalità type-ahead. API Places e Geocoding per
dell'indirizzo IP. l'API Distance Matrix per classificare le località in base a distanza, tempo e
modalità di viaggio. API Directions per mostrare un percorso in base al tempo di percorrenza e alla modalità di viaggio.
Al centro del diagramma, un'icona del datastore che rappresenta i punti dati personalizzati delle sedi
fino all'icona di un server web con una freccia a due punte che indica la lettura e la scrittura dei dati
tra server web e datastore. Frecce tra il browser web
e le API passano attraverso il server web come intermediari.](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/solutions/images/store-locator/locator_arch_diagram.png?authuser=8&hl=it)
Abilitazione delle API in corso…
Per implementare queste pratiche, devi abilitare le API seguenti nel Console Google Cloud: di Gemini Advanced. Per ulteriori informazioni sulla configurazione, vedi Guida introduttiva all'utilizzo di Google Maps Platform.Sezioni relative all'implementazione
Di seguito sono riportate le pratiche e le personalizzazioni che tratteremo in questo argomento.
- L'icona del segno di spunta è una pratica di base.
- L'icona a forma di stella è una personalizzazione facoltativa, ma consigliata per migliorare la soluzione.
Visualizzazione delle sedi su una mappa interattiva |
Crea una mappa che consenta agli utenti di vedere i dettagli sulla posizione, spostarsi e aumentare e diminuire lo zoom. Oppure esplora Soluzione Locator Plus di Builder rapido per creare rapidamente una mappa, inclusa la facilità di importazione dei dettagli dell'attività dal tuo . Profilo dell'attività delle schede, incorporando i link di prenotazione degli appuntamenti ed eseguendo il deployment in Google Cloud Storage. |
|
Fornire i dettagli sul luogo | Dopo che gli utenti hanno trovato le sedi più vicine su una mappa, assegna loro un significato Place Details sulle sedi per aiutarle a prendere decisioni. | |
Visualizzazione delle località da una visualizzazione a 45° | Offri agli utenti una migliore visuale della tua posizione nella vista Satellite da un'angolazione di 45°. | |
Identificare la località dell'utente | Aggiungi la funzionalità di digitazione a consumo per migliorare l'esperienza utente su tutte le piattaforme. migliorare la precisione degli indirizzi con il minimo sforzo di sequenze di tasti. | |
Visualizzazione del tempo di percorrenza e della distanza per i luoghi più vicini | Calcola la distanza da percorrere e il tempo di percorrenza per più luoghi di partenza e di arrivo, la possibilità di specificare vari mezzi di trasporto come a piedi, in auto, o in bicicletta. | |
Aiutare gli utenti a prenotare appuntamenti |
Consenti agli utenti di prenotare un appuntamento dal riquadro laterale Place Details. Oppure esplora Soluzione Locator Plus di Builder rapido per creare rapidamente una mappa, inclusa la facilità di importazione dei dettagli dell'attività dal tuo . Profilo dell'attività delle schede, incorporando i link di prenotazione degli appuntamenti ed eseguendo il deployment in Google Cloud Storage. |
|
Mostrare offerte locali | Mostra agli utenti le offerte locali cliccabili nel riquadro laterale Place Details. | |
Fornire indicazioni stradali | Ottieni dati di indicazioni stradali dall'origine alla destinazione utilizzando vari tipi di trasporto ad esempio a piedi, in auto, in bicicletta e con il trasporto pubblico. | |
Personalizzazione della mappa | Crea indicatori personalizzati per mettere in evidenza le tue sedi e applica uno stile alla mappa che corrispondano ai colori del brand. Mostra (o nascondi) punti d'interesse specifici su la mappa per aiutare gli utenti a orientarsi meglio e a controllare la densità dei PDI per per evitare il disordine della mappa. | |
Ottenere insight sull'utilizzo con dati e analisi | Configura e utilizza Google Analytics per ottenere informazioni sulla tua strategia di localizzazione e implementazione. | |
Invio di indicazioni stradali al dispositivo mobile | Oltre a mostrare le indicazioni stradali sul locator, puoi anche inviare le indicazioni stradali a un smartphone dell'utente per navigare utilizzando Google Maps in movimento. | |
Visualizzazione di Street View per aiutare gli utenti a visualizzare la località | Fornisci agli utenti immagini di Street View con viste a 360 gradi per orientarli meglio a trovare la tua sede più velocemente. | |
Determinare la posizione dell'utente con la geolocalizzazione | Se non vuoi fare affidamento sui servizi di geolocalizzazione integrati nel dispositivo, usa Geolocalizzazione per identificare più facilmente la posizione dell'utente. | |
Combinare i dati sulla posizione personalizzati con Place Details | Combina i dettagli personalizzati della tua sede con Place Details per fornire agli utenti una vasta gamma di dati per prendere decisioni. |
Visualizzazione delle sedi su una mappa interattiva
Il localizzatore è una parte importante dell'esperienza utente. Alcuni siti, tuttavia, potrebbero non includere persino una semplice mappa, che obbligano gli utenti ad abbandonare il sito o l'app per trovare in ogni località. Ciò si traduce in un'esperienza non ottimale per gli utenti che devono navigare tra le pagine per trovare le informazioni di cui hanno bisogno. Puoi invece migliorare questa esperienza incorporando e personalizzando le mappe nelle tue applicazioni.
Questa operazione può essere eseguita in diversi modi: (1) mediante Soluzione Locator Plus di Builder rapido per fornire questa funzionalità fin dal primo avvio e (2) utilizzare la tua implementazione di Dynamic Maps. In questa sezione vengono descritte in dettaglio queste opzioni.
Utilizzo di Builder rapido Locator Plus
Puoi utilizzare lo Soluzione Locator Plus di Builder rapido per importare i dettagli dal profilo della tua attività. Un cambiamento nel business i dettagli del profilo della tua attività verranno visualizzati nello Store locator sul tuo sito web. ad esempio orari, dati di contatto, foto, opzioni di servizio e altro ancora. Builder rapido può consentirti di esplorare rapidamente la configurazione di sedi di attività commerciali su una mappa, generare codice di cui è possibile eseguire il deployment o eseguire il deployment direttamente in Google Cloud Storage in pochi minuti.
![Integrazione del profilo dell'attività](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/images/locator_gbp_integration.gif?authuser=8&hl=it)
![Eseguire il deployment in Cloud](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/images/locator_deploy_to_cloud.gif?authuser=8&hl=it)
Utilizzo della propria implementazione di Dynamic Maps
In questo esempio vengono utilizzati: API Maps JavaScript | Disponibile anche: Android | iOS |
Aggiungere una mappa dinamica alla pagina, ovvero una mappa che gli utenti possono spostare, aumentare e diminuire lo zoom e visualizzare dettagli su vari luoghi e punti di può essere fatto con poche righe di codice.
Innanzitutto, devi includere l'API Maps JavaScript nella pagina. Per farlo, devi collegare lo script seguente nella pagina HTML.
<script defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&solution_channel=GMP_guides_locatorplus_v2_a"></script>
L'URL fa riferimento alla funzione initMap
JavaScript che viene eseguita quando la pagina
viene caricato automaticamente. Nell'URL, puoi anche definire
lingua o regione della mappa per assicurarti che sia formattata nel modo corretto per
il paese specifico scelto come target. L'impostazione di una regione garantisce inoltre che il comportamento
le app utilizzate al di fuori degli Stati Uniti sono differenziate in base alla regione impostata. Visualizza
Dettagli sulla copertura di Google Maps Platform
per un elenco completo delle lingue e delle regioni supportate e scopri di più su
region
:
dell'uso dei parametri.
Successivamente, hai bisogno di un div
HTML per posizionare la mappa nella pagina.
Questo è il luogo in cui verrà visualizzata la mappa.
<div id="map"></div>
Il passaggio successivo consiste nell'impostare le funzionalità di base della mappa. Questo avviene nel
Funzione script initMap
specificata nell'URL dello script. In questo script,
mostrata nell'esempio seguente, puoi impostare la posizione iniziale,
il tipo di mappa e
quali controlli saranno disponibili sulla mappa per i tuoi utenti. Nota che
getElementById()
fa riferimento alla "mappa" ID div
sopra.
function initMap() { const map = new google.maps.Map(document.getElementById("map"), { zoom: 12, center: { lat: 51.485925, lng: -0.129500 }, zoomControl: false }); }
Per un locator, di solito ti interessa impostare la posizione iniziale, punto o limiti e il livello di zoom (il livello di zoom della mappa su quella località). Più alta altri elementi, come l'ottimizzazione dei controlli, sono facoltativi quando stabilisci il livello interazione con la mappa.
Recupero degli ID dei luoghi in corso...
In questo esempio vengono utilizzati: API Places | Disponibile anche: JavaScript |
Potresti avere un database delle tue sedi con informazioni di base come il nome
posizione, indirizzo e numero di telefono. Per recuperare le informazioni che Google Maps
La piattaforma contiene informazioni su quel luogo, incluse le coordinate geografiche e i contributi degli utenti
informazioni, trova l'ID luogo corrispondente a ciascuna delle località presenti nel tuo database. Puoi
chiama
Trova l'endpoint di Place in Place Search dell'API Places e richiede solo il campo place_id
. Ecco un esempio di richiesta
ID luogo della sede di Google a Londra:
https://maps.googleapis.com/maps/api/place/findplacefromtext/json?input=google%20london&inputtype=textquery&fields=place_id&key=YOUR_API_KEY&solution_channel=GMP_guides_locatorplus_v2_a
Puoi memorizzare questo ID luogo nel tuo database e usalo come un modo efficiente per richiedere informazioni sul luogo. Di seguito sono istruzioni per utilizzare l'ID luogo per geocodificare, recuperare i dettagli del luogo e richiedere indicazioni stradali al luogo.
Geocodifica delle tue sedi
In questo esempio vengono utilizzati: API Geocoding | Disponibile anche: JavaScript |
Se il database delle sedi contiene indirizzi ma non coordinate geografiche, utilizza la API Geocoding per ottenere la latitudine e la longitudine di quell'indirizzo per al fine di posizionare l'indicatore sulla mappa. Puoi geocodificare i tuoi indirizzi sul lato server archiviare le latitudini e le longitudini nel database aggiorna almeno ogni 30 giorni.
Ecco un esempio di utilizzo dell'API Geocoding per ottenere latitudine e longitudine dell'ID luogo restituito per l'ufficio di Google di Londra:
https://maps.googleapis.com/maps/api/geocode/json?place_id=ChIJVSZzVR8FdkgRTyQkxxLQmVU&key=YOUR_API_KEY&solution_channel=GMP_guides_locatorplus_v2_a
Aggiunta di località alla mappa
Il passaggio successivo consiste nell'aggiungere le sedi alla mappa. Questo di solito viene fatto aggiungendo indicatori alla mappa, nonostante esistano altre opzioni che puoi utilizzare, come dati strati.
Una volta specificate la latitudine e la longitudine della tua località, ecco un esempio di aggiunta un indicatore sulla mappa:
var marker = new google.maps.Marker({ position: { lat: 51.493073, lng: -0.146550 }, label:"A", title:"Location Name" }); // To add the marker to the map, call setMap(); marker.setMap(map);
Con pochi indicatori puoi vedere insieme la posizione di una serie di luoghi.
![](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/solutions/images/store-locator/maps.png?authuser=8&hl=it)
Se ci sono molte località, ti consigliamo di raggruppare gli indicatori utilità per JavaScript, Android oppure iOS. Ecco un esempio di clustering di indicatori nell'esempio GitHub di Store locator JavaScript.
Invio dei dettagli sul luogo
In questo esempio viene utilizzato: API Maps JavaScript | Disponibile anche: API | Android | iOS |
Puoi condividere i Place Details che gli utenti devono conoscere prima di visitare uno di le tue sedi. Con dettagli dettagliati del luogo come dati di contatto, orari di apertura, valutazioni degli utenti, foto degli utenti e informazioni stato di chiusura, gli utenti sapranno esattamente cosa aspettarsi quando visitano la sede dell'attività. Dopo aver effettuato una chiamata all'API Places, puoi filtrare e la risposta viene visualizzata in una finestra informativa, in una barra laterale web o in qualsiasi altro modo.
Per richiedere i dettagli del luogo, devi disporre dell'ID luogo di ciascuna delle tue sedi. Consulta la sezione Recupero degli ID luogo per recuperare l'ID luogo del tuo in ogni località.
Espandi per visualizzare i video relativi alla richiesta di Dettagli luogo:
Sapere gli orari di apertura
Controlla le chiusure
Costi sotto controllo
Nell'esempio seguente viene utilizzata l'API Places Library, Maps JavaScript per recuperare Place Details e aggiungerli a una InfoWindow. Questa implementazione utilizza la strategia di risparmio che attiva una richiesta Place Details solo quando l'utente richiede i dettagli facendo clic su sull'indicatore anziché recuperare preventivamente i dettagli di tutte le località, di interesse degli utenti.
const marker = new google.maps.Marker({ map, position: { lat: 51.493073, lng: -0.14655 }, }); const request = { placeId: "ChIJVSZzVR8FdkgRTyQkxxLQmVU", fields: ["name", "formatted_address", "rating", "website"], }; const infowindow = new google.maps.InfoWindow(); const service = new google.maps.places.PlacesService(map); google.maps.event.addListener(marker, "click", function () { service.getDetails(request, (place, status) => { if (status === google.maps.places.PlacesServiceStatus.OK && place) { infowindow.setContent( "<div><strong>" + place.name + "</strong><br>" + place.formatted_address + "<br>" + "Rating: " + place.rating + " stars<br>" + place.website + "</div>" ); infowindow.open(map, this); } }); });
Visualizzazione delle località da una visualizzazione a 45°
In questo esempio viene utilizzato: API Maps JavaScript | Disponibile anche: Android | iOS |
Offrire agli utenti una vista aerea della tua posizione li aiuta a farsi un'idea più chiara di cosa. che li aiuta a trovarli più facilmente. Quando un utente seleziona una singola località. per vedere altri dettagli, puoi aumentare lo zoom sul luogo per visualizzare i satelliti disponibili immagini da un angolo di 45°.
Il seguente esempio di codice imposta la mappa su un livello di zoom elevato, un tipo di mappa compatibile e un angolo di inclinazione per visualizzare immagini a 45°, se disponibili. Dettagli su 45° la disponibilità delle immagini è spiegata nel documentazione.
function seeDetail(location) { map.setCenter(location); map.setZoom(19); map.setMapTypeId(google.maps.MapTypeId.HYBRID); map.setTilt(45); }
Ripristino della visualizzazione mappa originale
Gli utenti spesso preferiscono passare dalla visualizzazione dettagliata di un singolo
sede e la visualizzazione di riepilogo di varie sedi nelle vicinanze. Per facilitare questa operazione, aggiungi una
per rilevare quando l'utente esce dalla visualizzazione dei dettagli nelle interazioni sulla mappa o
la visualizzazione elenco. Ad esempio, l'ascolto dell'evento zoom_changed
sul
Oggetto map
indica che l'utente ha diminuito manualmente lo zoom dalla visualizzazione dettagliata o ha chiamato
un'altra funzione che ha aggiornato il livello di zoom. In questo esempio, per diminuire lo zoom,
mappa al tipo di mappa originale e inclinalo.
let originalMapTypeId = google.maps.MapTypeId.ROADMAP; map.addListener("zoom_changed", () => { const newZoom = map.getZoom()!; if (newZoom < 19) { map.setTilt(0); map.setMapTypeId(originalMapTypeId); } });
Identificazione della località dell'utente
In questo esempio vengono utilizzati: API Maps JavaScript | Disponibile anche: Android | iOS |
Il prossimo componente fondamentale in qualsiasi localizzatore è l'identificazione della posizione di partenza dell'utente. Per impostazione predefinita, puoi utilizzare i servizi di geolocalizzazione dei dispositivi mobili e la geolocalizzazione del browser web per richiedere autorizzazioni utente per impostare l'origine come la posizione attuale dell'utente. Tuttavia, l'utente può neghi queste autorizzazioni o potresti voler impostare una località diversa come punto di partenza.
Gli utenti di oggi sono abituati alla funzionalità type-ahead di completamento automatico sul consumer di Google Maps. Questa funzionalità può essere integrata in qualsiasi applicazione utilizzando Le librerie di Google Maps Platform Places sui dispositivi mobili e sul web. Quando un utente digita un indirizzo, il completamento automatico compila il resto con l'uso dei widget. Puoi anche fornire le tue funzionalità di completamento automatico utilizzando direttamente le librerie di Places.
Per aggiungere la libreria Place Autocomplete al tuo sito è sufficiente aggiungere un paio di
i parametri di query all'URL dello script dell'API Maps JavaScript. Nel seguente
ad esempio, l'aggiunta è libraries=places
.
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places&callback=initMap&solution_channel=GMP_guides_locatorplus_v2_a" defer></script>
Successivamente, aggiungi una casella di testo alla pagina per l'input dell'utente.
<input id="autocomplete" placeholder="Enter starting address, city, or zip code" type="text"></input>
Infine, devi inizializzare il servizio di completamento automatico e collegarlo alla casella di testo denominata.
Vincolo
Posiziona le previsioni di completamento automatico per geocodificare i tipi di configurazione del campo di immissione.
per accettare indirizzi, quartieri, città e codici postali in modo che gli utenti possano inserire
di specificità per descrivere la loro origine. Assicurati di richiedere geometry
in modo che la risposta contenga la latitudine e la longitudine del luogo di origine dell'utente. Utilizzerai
queste coordinate della mappa per ricentrare la mappa e indicare la relazione delle tue posizioni con
l'origine.
// Create the autocomplete object, restricting the search predictions to // geographical location types. const autocomplete = new google.maps.places.Autocomplete( document.getElementById("autocomplete"), { types: ["geocode"], componentRestrictions: {'country': ['gb']}, fields: ['place_id', 'geometry', 'formatted_address'] } ); // When the user selects an address from the drop-down // zoom to the select location and add a marker. autocomplete.addListener("place_changed", addUserLocation); }
In questo esempio, una volta che l'utente ha selezionato l'indirizzo,
La funzione addUserLocation()
è
eseguito. Viene così scelta la geometria del risultato corrispondente, la posizione dell'utente e, successivamente, viene spostato il parametro
mappa a tale località e aggiunge un indicatore.
function addUserLocation() { // Get the place details from the autocomplete object. const place = autocomplete.getPlace(); // Add a marker to the map. const marker = new google.maps.Marker({ map: map }); marker.setLabel("C"); marker.setPosition(place.geometry.location); // Zoom the map to the marker. map.panTo(place.geometry.location); map.setZoom(12); }
Puoi quindi vedere la relazione tra l'utente e le località specifiche, come mostrato nell'immagine di seguito.
![](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/solutions/images/store-locator/autocomplete.png?authuser=8&hl=it)
Espandi questo riquadro per vedere le procedure dettagliate video per l'aggiunta di un luogo Completamento automatico per l'app:
Sito web
App Android
App per iOS
Visualizzazione del tempo di percorrenza e della distanza dai luoghi più vicini
In questo esempio vengono utilizzati: . API Distance Matrix | Disponibile anche: . Servizio Distance Matrix, API Maps JavaScript |
Una volta che disponi della località dell'utente, puoi confrontarla con la località in cui si trovano . Facendo questo con il servizio Distance Matrix, l'API Maps JavaScript aiuta i tuoi utenti selezionano la località più comoda per loro in base al tempo di guida o alla strada distanza percorsa.
La visualizzazione di sedi vicine a un utente implica che tu già conosci le tue sedi compilate. Quando utilizzi un tuo database di località, la chiave è assicurarsi che i dati siano in un formato utilizzabile in una mappa come GeoJSON, descritto nel Livello dati.
Il modo standard di organizzare un elenco di sedi è ordinarle in base alla distanza. Spesso questo la distanza viene calcolata utilizzando la linea retta che va da un utente al luogo, ma può essere fuorviante. La linea retta potrebbe essere sopra un fiume impassibile o attraverso strade trafficate in un momento in cui un'altra posizione potrebbe essere più comoda. È importante quando più località a pochi chilometri di distanza l'una dall'altra.
Il servizio Distance Matrix utilizza un elenco di località di origine e di destinazione e non solo la distanza da percorrere, ma anche il tempo che le separano. Nel caso di un utente, sarebbe dove si trova attualmente, o il punto di partenza desiderato, e destinazioni sarà quella delle località. Origini e destinazioni possono essere specificate come coppie di coordinate o come indirizzi; Quest'ultimo verrà abbinato quando verrà chiamato il servizio. Puoi usare la matrice delle distanze con una serie di parametri aggiuntivi per mostrare risultati basati sui tempi di guida attuali o futuri.
L'esempio seguente chiama il servizio Distance Matrix, specificando l'origine e le località dell'utente. Questo esempio mostra la distanza dal centro della mappa a tre uffici Google a Londra.
Riferimento rapido per la codifica dell'URL: %2C
= , (virgola), %3A
= : (due punti),
e %7C
= | (barra verticale).
https://maps.googleapis.com/maps/api/distancematrix/json?origins=51.493490%2C-0.097288
&destinations=place_id%3AChIJVSZzVR8FdkgRTyQkxxLQmVU%7Cplace_id%3AChIJVSZzVR8FdkgR-HklrBMO0Hc%7Cplace_id%3AChIJ4abvVDwbdkgRDZVFR7A6Bcc
&units=metric
&mode=driving
&key=YOUR_API_KEY
&solution_channel=GMP_guides_locatorplus_v2_a
Ecco una versione che puoi copiare ed eseguire:
https://maps.googleapis.com/maps/api/distancematrix/json?key=YOUR_API_KEY&origins=51.493490%2C-0.097288&destinations=place_id%3AChIJVSZzVR8FdkgRTyQkxxLQmVU%7Cplace_id%3AChIJVSZzVR8FdkgR-HklrBMO0Hc%7Cplace_id%3AChIJ4abvVDwbdkgRDZVFR7A6Bcc&units=metric&mode=driving&solution_channel=GMP_guides_locatorplus_v2_a
La risposta effettiva del servizio sarà un elenco di indirizzi corrispondenti, distanze e durate simili a quelle mostrate nell'esempio seguente:
Espandi per visualizzare la risposta di esempio:
{ "destination_addresses": [ "123 Buckingham Palace Rd, Victoria, London SW1W 9SH, UK", "1-13 St Giles High St, West End, London WC2H 8AG, UK", "6 Pancras Square, Kings Cross, London N1C 4AG, UK" ], "origin_addresses": [ "Unnamed Road, London, UK" ], "rows": [ { "elements": [ { "distance": { "text": "4.5 km", "value": 4540 }, "duration": { "text": "15 mins", "value": 924 }, "status": "OK" }, { "distance": { "text": "5.0 km", "value": 5043 }, "duration": { "text": "17 mins", "value": 1044 }, "status": "OK" }, { "distance": { "text": "6.9 km", "value": 6919 }, "duration": { "text": "23 mins", "value": 1357 }, "status": "OK" } ] } ], "status": "OK" }
La seguente immagine mostra l'origine (indicatore rosso C) e le destinazioni su una mappa:
![L'immagine mostra una mappa della città con la posizione dell'utente come un indicatore rosso
e le località circostanti come indicatori verdi.](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/solutions/images/store-locator/distance_matrix.png?authuser=8&hl=it)
La distanza in linea retta e quella del percorso spesso differiscono, come illustrato nella tabella seguente.
Località | Distanza retta | Strada nel traffico / tempo |
---|---|---|
Località A | 3,32 km | 4,5 km / 15 minuti |
Località B | 3,20 km | 5,0 km / 17 minuti |
Località C | 4,84 km | 6,9 km / 23 minuti |
Anche se la località B è la più vicina per distanza, il percorso e il tempo per raggiungerla sono più tempo perché la località A è accessibile tramite un'autostrada.
Una volta inviata la richiesta, puoi elaborare la corrispondenza per ordinare le risposte in base a durata del tempo di guida. Puoi trovare esempi di questa funzione nel localizzatore codelab.
Fornire indicazioni stradali
In questo esempio vengono utilizzati: . Servizio indicazioni stradali dell'API Maps JavaScript | Disponibile anche: API Directions web service per l'utilizzo su Android e iOS, direttamente dall'applicazione o da remoto attraverso un proxy server |
Mostrare agli utenti le indicazioni stradali all'interno del tuo sito o delle tue applicazioni significa che questi uscire dal sito, il che significa che gli utenti non saranno distratti pagine web o visualizzare i concorrenti sulla mappa. Potresti anche mostrare le emissioni di anidride carbonica dei modalità di viaggio specifica e mostrare l'impatto di un determinato viaggio.
Il servizio Directions offre anche funzioni che ti consentono di elaborare i risultati. mostrarle facilmente su una mappa.
Di seguito è riportato un esempio di visualizzazione del riquadro delle indicazioni stradali. Per ulteriori informazioni sul consulta l'esempio Visualizzazione di indicazioni stradali testuali.
Per saperne di più su queste funzioni di Maps, consulta le Documentazione dell'API Maps JavaScript o dai un'occhiata alla procedura passo passo codelab per creare un locator.
Aiutare gli utenti a prenotare appuntamenti
Quando gli utenti visualizzano Place Details della tua sede in un riquadro laterale, puoi offrire lo la comodità di prenotare un appuntamento facendo clic su un pulsante illustrato nella figura che segue.
![](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/solutions/store-locator/images/store-locator-appointments.png?authuser=8&hl=it)
Questa operazione può essere eseguita in diversi modi: (1) mediante Soluzione Locator Plus di Builder rapido per fornire questa funzionalità fin dal primo avvio e (2) utilizzare . Profilo dell'attività. Queste opzioni vengono descritte in dettaglio in questa sezione.
Utilizzo di Builder rapido Locator Plus
Puoi utilizzare lo Soluzione Locator Plus di Builder rapido per importare facilmente i dettagli dell'attività . Profilo dell'attività. Dopo l'importazione nello strumento Builder rapido, puoi abilitare link di prenotazione degli appuntamenti, ove disponibili, per le sedi della tua attività tramite Prenota con Google. Anche se non hai un profilo dell'attività associato a un Account Google, puoi comunque utilizzare Builder rapido per incorporare link di prenotazione per le attività che hai già attivato con terze parti fornitori di servizi di prenotazione tramite Prenota con Google*.
![Prenota con Google](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/images/locator_reserve_with_google.gif?authuser=8&hl=it)
*Prenota con Google è disponibile solo in alcuni paesi/regioni in cui le attività puoi collaborare con un fornitore di servizi di prenotazione . Se ti interessa Prenota con Google, ma al momento non stai lavorando con Prenota con Google con il partner Google, chiedi al tuo fornitore di inviare il suo interesse completando questo modulo e consulta le nostre documentazione per capire come iniziare. Se non collabori già con un fornitore di servizi di prenotazione, puoi vedere di fornitori idonei nella sezione Prenotazioni in Gestione dei profili delle attività.
Utilizzare Profilo dell'attività per attivare la prenotazione degli appuntamenti
Quando gestisci la tua presenza online con Profilo dell'attività, l'attività le località che crei siano associate agli ID luogo di Google Maps Platform per abilitare funzionalità di mappatura integrata con i dati aziendali.
Le API Profilo dell'attività ti consentono di creare azioni che puoi recuperare, ad esempio la prenotazione di appuntamenti e vengono mostrati nelle tue app, ma per l'attivazione sono necessari alcuni passaggi manuali, come descritto di seguito.
Quando gli utenti visualizzano Place Details per una delle tue sedi in un riquadro laterale, puoi: fornisci un link per fissare un appuntamento. In questa sezione viene descritto come fare.
-
Crea un'API del profilo dell'attività
placeActionLink
per la località del tipoAPPOINTMENT
,ONLINE_APPOINTMENT
, oDINING_RESERVATION
.placeActionLink
sarà l'oggetto per il link dell'appuntamento nel riquadro laterale. Se hai già creato l'azione Appuntamento link desiderato, vai al passaggio successivo.) Ecco un esempio di risposta da una richiestaplaceActionLinks.create
operazione POST:{ "name": "locations/15899957830169237700/placeActionLinks/9c984be778a7ebbc", "providerType": "MERCHANT", "isEditable": true, "uri": "https://example.com/reservation-uri", "placeActionType": "DINING_RESERVATION", "createTime": "2021-05-01T01:17:41.609161Z", "updateTime": "2021-05-01T01:17:41.609161Z" }
-
Trova la sede del profilo dell'attività associata all'ID luogo di Google Maps Platform.
Quando gli utenti visualizzano Place Details, vedono i dettagli di una piattaforma Google Maps Platform l'ID del luogo. L'ID luogo è associato a un ID località del profilo dell'attività, pertanto devi trova l'ID località in base a quello sulla mappa da recuperare e visualizzare il link di prenotazione degli appuntamenti che hai creato. Effettua le seguenti chiamate alle API del profilo dell'attività:
- Elenca gli account del progetto.
- Elenca tutte le sedi all'interno di un account.
- Nelle sedi dell'account,
LocationKey
contiene l'ID luogo di Google Maps Platform, che puoi confrontare con l'ID della località visualizzata.
-
Con l'ID località, puoi ottenere il link all'azione che vuoi. Per recuperare un file esistente appuntamento
placeActionLink
, elenco esistenteplaceActionLinks
per la località e filtra perplaceActionType
per trovare il link dell'appuntamento che vuoi utilizzare (APPOINTMENT
,ONLINE_APPOINTMENT
oDINING_RESERVATION
).L'esempio seguente mostra un APPUNTAMENTO
placeActionLink
nella risposta dalla chiamata LIST.{ "placeActionLinks": [ { "name": "locations/15899957830169237700/placeActionLinks/9c984be778a7ebbc", "providerType": "MERCHANT", "isEditable": true, "uri": "https://example.com/", "placeActionType": "APPOINTMENT", "createTime": "2021-05-01T01:17:41.609161Z", "updateTime": "2021-05-01T01:17:41.609161Z" } ] }
- Crea e compila un campo
<div>
nel riquadro laterale con i dati pertinenti delplaceActionLink
, in particolare l'URI dell'oggetto link per la prenotazione degli appuntamenti.
Altre alternative per aggiungere i link agli appuntamenti
Se non gestisci un profilo dell'attività o non vuoi utilizzare Soluzione Locator Plus di Builder rapido, controlla la tua piattaforma di prenotazione degli appuntamenti per la documentazione su come incorporare un widget di prenotazione nel un sito web o un'app. Un'altra opzione è utilizzare Google Cloud, ad esempio Cloud Spanner per la gestione dell'inventario (video).
Visualizzazione delle offerte locali
Nel riquadro laterale Place Details di una sede, puoi mostrare offerte locali a cui gli utenti possono fare clic. L'API Google My Business ti consente di creare e recuperare i "post" (come le offerte locali) che sono associate alle tue sedi. La figura seguente mostra un esempio di offerta locale in una Riquadro laterale Place Details.
![](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/solutions/store-locator/images/store-locator-offers.png?authuser=8&hl=it)
(il diagramma dell'architettura nella sezione precedente) mostra le tecnologie disponibili per aggiungere offerte al tuo locator.)
Poiché le offerte locali sono associate alle sedi, devi trovare il profilo dell'attività
ID località associato all'ID luogo di Google Maps Platform per gli utenti posizione
stai visualizzando.
Se disponi dell'ID sede del profilo dell'attività, puoi recuperare l'offerta pertinente come
localPost
da visualizzare nel riquadro laterale di Place Details. Procedi nel seguente modo:
- Con l'API Google My Business,
creare i post sulle offerte che vuoi
display, di tipo
OFFER
-
Trova l'ID della località o della sede del profilo dell'attività associato all'ID luogo sulla mappa.
Quando gli utenti visualizzano Place Details, vedono i dettagli di una piattaforma Google Maps Platform l'ID del luogo. L'ID luogo è associato a un ID località del profilo dell'attività, pertanto devi trova l'ID località in base a quello sulla mappa da recuperare e visualizzare il link a offerta locale per la tua località. Effettua le seguenti chiamate alle API del profilo dell'attività:
- Elenca i tuoi del progetto.
- Elenca tutte le località all'interno di un account.
- Nelle sedi dell'account,
LocationKey
contiene l'ID luogo di Maps, che puoi confrontare con l'ID luogo della località visualizzato.
Di seguito è riportato un esempio di richiesta dei dettagli di una località in API di Profilo dell'attività:
https://mybusiness.googleapis.com/v4/accounts/111098884960588804666/locations/15899957830169237700
La risposta contiene un campo
locationKey
che è l'ID luogo che puoi utilizzare con le richieste di Google Maps Platform.Espandi per visualizzare la risposta di esempio.
{ "name": "accounts/111098884960588804666/locations/15899957830169237700", "locationName": "Sushi Sushi", "primaryPhone": "+49 2222 22222", "primaryCategory": { "displayName": "Restaurant", "categoryId": "gcid:restaurant", }, "regularHours": { "periods": [ { "openDay": "MONDAY", "openTime": "09:00", "closeDay": "MONDAY", "closeTime": "09:10" }, { "openDay": "TUESDAY", "openTime": "11:30", "closeDay": "TUESDAY", "closeTime": "24:00" } ] }, "locationKey": { "placeId": "ChIJs4wtL04X2jERbc8qHd_wZzk", "requestId": "2c72cbcb-ea2e-4d66-b684-0ef5f090300c" }, "latlng": { "latitude": 1.3670033, "longitude": 103.8556385 }, "openInfo": { "status": "OPEN", "canReopen": true }, "locationState": { "isGoogleUpdated": true, "canUpdate": true, "canDelete": true, "isVerified": true, "isPublished": true, "canHaveFoodMenus": true }, "attributes": [ { "attributeId": "has_delivery", "valueType": "BOOL", "values": [ false ] }, { "attributeId": "requires_masks_customers", "valueType": "BOOL", "values": [ true ] }, { "attributeId": "url_order_ahead", "valueType": "URL", "urlValues": [ { "url": "https://example.com/" }, ] }, { "attributeId": "pay_credit_card_types_accepted", "valueType": "REPEATED_ENUM", "repeatedEnumValue": { "setValues": [ "visa" ], "unsetValues": [ "american_express" ] } } ], "address": { "regionCode": "SG", "languageCode": "en-US", "postalCode": "560445", "addressLines": [ "445 Ang Mo Kio Ave 10" ] }, "profile": { "description": "Example restaurant" } }
-
Ora che disponi dell'ID località, puoi usufruire dell'offerta che ti interessa. Per recuperare un Pubblica un'offerta esistente, elenca gli elementi
localPosts
esistenti per la località e filtra pertopicType
diOFFER
per trovare i contenuti dell'offerta che vuoi utilizzare.Ecco un esempio di richiesta per elencare i post locali attivi per una sede:
https://mybusiness.googleapis.com/v4/accounts/111098884960588804666/locations/15899957830169237700/localPosts
L'esempio seguente mostra un
localPost
OFFER
nel la risposta corretta.Espandi per visualizzare la risposta di esempio.
{ "localPosts": [ { "name": "accounts/111098884960588804666/locations/15899957830169237700/localPosts/2524928563578730680", "languageCode": "en", "summary": "Buy One Get One Free on all order-ahead bento boxes today!", "state": "LIVE", "event": { "title": "Bento BOGO", "schedule": { "startDate": { "year": 2020, "month": 1, "day": 20 }, "startTime": {}, "endDate": { "year": 2021, "month": 1, "day": 21 }, "endTime": {} } }, "updateTime": "2020-09-11T10:56:22.594Z", "createTime": "2020-09-11T10:56:22.594Z", "searchUrl": "https://local.google.com/place?id=4156539623820808045&use=posts&lpsid=2524928563578730680", "media": [ { "name": "accounts/111098884960588804666/locations/15899957830169237700/media/localPosts/AF1QipOBQCIf40SbF_PPJxb_zvfCHmaTbv9Zw02PoYPS", "mediaFormat": "PHOTO", "googleUrl": "https://lh3.googleusercontent.com/p/AF1QipOBQCIf40SbF_PPJxb_zvfCHmaTbv9Zw02PoYPS" } ], "topicType": "OFFER", "offer": { "couponCode": "BOGO-JET-CODE", "redeemOnlineUrl": "https://www.example.com/redeem", "termsConditions": "Offer only valid for order-ahead orders placed online." } }, ], }
- Crea e compila un campo
<div>
nel riquadro laterale con i dati pertinenti dall'oggettolocalPost
.
Personalizzazione della mappa
Puoi modificare l'aspetto e i dettagli della tua mappa in diversi modi. Ad esempio, puoi:
- Crea i tuoi indicatori personalizzati per sostituire i segnaposto predefiniti sulla mappa.
- Modifica i colori degli elementi della mappa per rispecchiare il tuo brand.
- Controlla quali punti di interesse visualizzare (attrazioni, cibo, alloggi e così via) e a quale densità, così puoi concentrare l'attenzione degli utenti sulle tue sedi, evidenziando al contempo i punti di riferimento che aiutano gli utenti a raggiungere la località più vicina.
Creazione di indicatori personalizzati
Puoi personalizzare gli indicatori modificando il colore predefinito (che potrebbe mostrare se una posizione è attualmente aperta) o sostituendo l'indicatore con un'immagine personalizzata, come logo del tuo brand. Le finestre informative o popup possono fornire informazioni aggiuntive. agli utenti, ad esempio orari di apertura, numero di telefono o persino foto. Puoi anche creare indicatori personalizzati raster, vettoriali, trascinabili e persino animati.
Di seguito è riportata una mappa di esempio in cui vengono utilizzati indicatori personalizzati. (vedi il codice sorgente nella argomento degli indicatori personalizzati dell'API Maps JavaScript.
Per informazioni dettagliate, consulta la documentazione sugli indicatori per JavaScript (web) Android e iOS.
Definizione dello stile della mappa
Google Maps Platform ti consente di definire lo stile della tua mappa in modo che gli utenti possano trovare quella più vicina, raggiungerla il più velocemente possibile e rafforzare il proprio brand. Ad esempio, puoi modificare i colori della mappa per adattarli al tuo branding e ridurre elementi di distrazione sulla mappa tramite il controllo dei punti di interesse visibili agli utenti. Google Maps Platform offre anche una serie di modelli di base della mappa, alcuni dei quali sono ottimizzati per diversi settori, come viaggi, logistica, settore immobiliare e vendita al dettaglio.
Puoi creare o modificare gli stili di mappa nella console Google Cloud la pagina Stili di mappa nel progetto.
Espandi per visualizzare le animazioni della creazione e dello stile di mappa nella Console Cloud:
Stili di mappa del settore
Questa animazione mostra gli stili di mappa predefiniti del settore che puoi utilizzare. Questi offrono un punto di partenza ottimale per ogni tipo di settore. Ad esempio, Lo stile della mappa per la vendita al dettaglio riduce i punti d'interesse sulla mappa, consentendo agli utenti di concentrarsi sulle tue località, nonché i punti di riferimento per raggiungere la sede più vicina nel più breve tempo possibile e con la massima sicurezza.
![Nella pagina Stile di mappa, il mouse fa clic su Crea nuovo stile di mappa. Il giorno
nella pagina Nuovo stile mappa, il mouse fa clic sul pulsante di opzione accanto a ogni
seguenti stili ottimizzati per il settore: Viaggi, Logistica, Settore immobiliare e
Vendita al dettaglio. Ogni volta che fai clic su ciascun pulsante, la descrizione dello stile della mappa e
l'anteprima delle modifiche.](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/solutions/images/store-locator/ioms_animation.gif?authuser=8&hl=it)
Controllo dei punti di interesse
Questa animazione imposta il colore dell'indicatore per i punti d'interesse e aumenta la densità dei PDI nello stile della mappa. Più alta è la densità, maggiore Gli indicatori dei PDI vengono visualizzati sulla mappa.
![Nella pagina Stile di mappa, il mouse fa clic su Crea nuovo stile di mappa. Il giorno
Pagina Nuovo stile mappa, sotto Crea il tuo stile, il pulsante di opzione Google Maps
è selezionata. Il mouse fa clic sul pulsante di opzione Atlas per lo stile Atlas,
quindi fai clic su Apri nell'editor di stili. Nell'editor degli stili, il mouse fa clic
la funzione Punti d'interesse, quindi fa clic sull'elemento Icona, impostando
dal colore al rosso. Il mouse seleziona quindi la casella di controllo Densità PDI e le slide
il controllo della densità a destra per ottenere la densità massima. Sempre più rosso
gli indicatori vengono visualizzati sull'anteprima della mappa man mano che aumenta la densità. Il mouse si sposta
al pulsante Salva.](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/solutions/images/store-locator/poi_animation.gif?authuser=8&hl=it)
Ogni stile di mappa ha il proprio ID. Dopo aver pubblicato uno stile nella console Cloud, fai riferimento a quell'ID mappa nel tuo codice, il che significa che puoi aggiornare uno stile di mappa in tempo reale senza dover ricorrere al refactoring dell'app. Il nuovo look apparirà automaticamente l'applicazione esistente e possono essere utilizzate su più piattaforme. I seguenti esempi mostrano come per aggiungere un ID mappa a una pagina web utilizzando l'API Maps JavaScript.
Se includi uno o più map_ids
nell'URL dello script, il valore
L'API Maps JavaScript rende automaticamente questi stili disponibili per una mappa più rapida
quando chiami questi stili nel codice.
<script
src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&map_ids=MAP_IDs&callback=initMap&solution_channel=GMP_guides_locatorplus_v2_a">
</script>
Il seguente codice mostra una mappa con stili nella pagina web. (Non mostrato è un codice HTML
<div id="map"></div>
elemento in cui verrà visualizzata la mappa sul
page.)
map = new google.maps.Map(document.getElementById('map'), { center: {lat: 51.485925, lng: -0.129500}, zoom: 12, mapId: '1234abcd5678efgh' });
Scopri di più sull'integrazione della Personalizzazione delle mappe basata su cloud in JavaScript (web) Android e iOS.
Ottenere insight sull'utilizzo con l'analisi
Con l'analisi dei dati, puoi ottenere informazioni preziose su come gli utenti interagiscono con il tuo localizzatore di musica. Questa sezione fornisce indicazioni su come configurare e monitorare Google Analytics e Dati e analisi di Profilo dell'attività per monitorare i dati che ti interessano di più. Per Builder rapido Per gli utenti di Locator Plus, una dashboard di analisi ti aiuta ad analizzare e generare approfondimenti, offrendoti una Immagine dell'efficacia con cui i visitatori del tuo sito interagiscono con lo Store locator, in base a dati anonimizzati.
![Analisi Locator Plus](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/images/locator_analytics.png?authuser=8&hl=it)
Per accedere a questo report, vai alla dei report sul coinvolgimento della console Cloud. Per ulteriori dettagli su questo report, consulta report sul coinvolgimento.
Data la potenza e la flessibilità di Google Analytics, non proveremo a fornire informazioni complete su configurazione e utilizzo. Ti indirizzeremo invece alla documentazione chiave ulteriori letture e istruzioni, evidenziando al contempo le principali considerazioni sull'analisi all'app di localizzazione.
Impostazione di Google Analytics
Se già utilizzi Google Analytics con la tua app, puoi saltare questa sezione.
Di seguito è riportato un esempio di "tag globale" da incollare sul tuo sito per attivare Google Analisi.
<!-- Global site tag (gtag.js) - Google Analytics --> <script async src="https://www.googletagmanager.com/ gtag/js?id=G-XR5B5D4NW0"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-XR5B5D4NW0'); </script>
Che utilizzi Google Tag Manager o aggiungi Google Analytics direttamente al tuo sito, è fondamentale capire come utilizzare l'implementazione di Google Analytics per:
- Attivare le interazioni degli utenti, ad esempio i clic, che possono essere misurate indipendentemente dal sito web visualizzazioni di pagina (eventi).
- Visualizzare i dati non elaborati (metriche) in raggruppamenti significativi (dimensioni o dimensioni personalizzate).
Utilizzo di eventi personalizzati
Di seguito è riportato un esempio di definizione di un evento personalizzato nel tuo locator:
gtag('event', 'location', { 'method': 'address' });
È importante che i nomi event
e method
siano abbastanza chiari
per capire gli eventi nei report. Attivali per lo specifico
le interazioni da misurare, ad esempio quando un utente seleziona un indirizzo
Elenco a discesa del completamento automatico, mostrato nella figura che segue.
![](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/solutions/store-locator/images/event_autocomplete_select.png?authuser=8&hl=it)
Puoi inviare la seguente chiamata di monitoraggio a Google Analytics che utilizza l'evento e che hai definito. Per facilitare la lettura, mostreremo ogni parametro di query su una riga separata.
https://www.google-analytics.com/g/collect?v=2 &tid=G-XR5B5D4NW0 >m=2oe550 &_p=64678170 &sr=1920x1200 &ul=fr &cid=489856786.1598861364 &_s=2 &dl=http%3A%2F%2.storelocator.html &dt=Store%20Locator &sid=1620827159 &sct=1 &seg=1 &en=location &_et=6032 &ep.method=address
La figura seguente mostra come questa chiamata a Google Analytics viene visualizzata nell'ispezione del browser della scheda Rete. (Fai clic per ingrandire).
![](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/solutions/store-locator/images/event_inspect.png?authuser=8&hl=it)
Per verificare che i tag evento personalizzati vengano acquisiti correttamente, visualizza il "In tempo reale" in Google Analytics. Ad esempio, la "posizione" configurato in precedenza per Place Autocomplete viene visualizzato in Google Analytics come mostrato nelle figure che seguono.
![](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/solutions/store-locator/images/event_realtime.png?authuser=8&hl=it)
![](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/solutions/store-locator/images/event_realtime2.png?authuser=8&hl=it)
In alternativa, puoi monitorare gli eventi in tempo reale utilizzando DebugView, come mostrato in nella figura che segue. Tieni presente che devi attendere 24 ore prima di accedere a un report Eventi completo nella Coinvolgimento > Eventi di Google Analytics.
![](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/solutions/store-locator/images/event_debug.png?authuser=8&hl=it)
Puoi anche sviluppare e misurare strategie per aumentare le visite nei tuoi punti vendita. le tue posizioni dall'app di rilevamento. Ad esempio, Google Analytics ha una Visite in negozio in Analytics che collegano le risorse fisiche visite in negozio Analytics (misurati da Google Ads) ai dati e alle analisi dei localizzatori. Puoi anche sviluppare strategie di app-to-location, come le offerte online utilizzabili presso le tue sedi fisiche.
Metriche del profilo dell'attività
Oltre a monitorare gli eventi, le metriche e le dimensioni che ti interessano Anche Profilo dell'attività di Google Analytics ha le proprie metriche. Ad esempio, se aggiungi al tuo locator i link per la prenotazione di appuntamenti e le offerte locali, visualizzare le metriche relative a visualizzazioni e clic.
La seguente richiesta di esempio alle API Profilo dell'attività richiede più tipi di
metriche di valutazione. Per monitorare i clic sull'offerta, LOCAL_POST_VIEWS_SEARCH
e
LOCAL_POST_ACTIONS_CALL_TO_ACTION
è la metrica più pertinente.
Espandi per visualizzare la richiesta di esempio.
POST https://mybusiness.googleapis.com/v4/accounts/111098884960528804666/locations:reportInsights Body: { "locationNames": [ "accounts/111098884960528804666/locations/15899957830169237700" ], "basicRequest": { "metricRequests": [ { "metric": "QUERIES_DIRECT" }, { "metric": "QUERIES_INDIRECT" }, { "metric": "VIEWS_MAPS" }, { "metric": "VIEWS_SEARCH" }, { "metric": "ACTIONS_DRIVING_DIRECTIONS" }, { "metric": "LOCAL_POST_VIEWS_SEARCH" }, { "metric": "LOCAL_POST_ACTIONS_CALL_TO_ACTION" } ], "timeRange": { "startTime": "2021-01-01T01:01:23.045123456Z", "endTime": "2021-04-30T23:59:59.045123456Z" } } }
Espandi per visualizzare la risposta di esempio.
{ "locationMetrics": [ { "locationName": "accounts/111098884960528804666/locations/15899957830169237700", "timeZone": "Asia/Singapore", "metricValues": [ { "metric": "QUERIES_DIRECT", "totalValue": { "metricOption": "AGGREGATED_TOTAL", "timeDimension": { "timeRange": { "startTime": "2021-01-01T01:01:23.045123456Z", "endTime": "2021-04-30T23:59:59.045123456Z" } }, "value": "82" } }, { "metric": "QUERIES_INDIRECT", "totalValue": { "metricOption": "AGGREGATED_TOTAL", "timeDimension": { "timeRange": { "startTime": "2021-01-01T01:01:23.045123456Z", "endTime": "2021-04-30T23:59:59.045123456Z" } }, "value": "1493" } }, { "metric": "VIEWS_MAPS", "totalValue": { "metricOption": "AGGREGATED_TOTAL", "timeDimension": { "timeRange": { "startTime": "2021-01-01T01:01:23.045123456Z", "endTime": "2021-04-30T23:59:59.045123456Z" } }, "value": "1571" } }, { "metric": "VIEWS_SEARCH", "totalValue": { "metricOption": "AGGREGATED_TOTAL", "timeDimension": { "timeRange": { "startTime": "2021-01-01T01:01:23.045123456Z", "endTime": "2021-04-30T23:59:59.045123456Z" } }, "value": "631" } }, { "metric": "ACTIONS_DRIVING_DIRECTIONS", "totalValue": { "metricOption": "AGGREGATED_TOTAL", "timeDimension": { "timeRange": { "startTime": "2021-01-01T01:01:23.045123456Z", "endTime": "2021-04-30T23:59:59.045123456Z" } }, "value": "3" } }, { "metric": "LOCAL_POST_ACTIONS_CALL_TO_ACTION", "totalValue": { "metricOption": "AGGREGATED_TOTAL", "timeDimension": { "timeRange": { "startTime": "2021-01-01T01:01:23.045123456Z", "endTime": "2021-04-30T23:59:59.045123456Z" } }, "value": "42" } }, { "metric": "LOCAL_POST_VIEWS_SEARCH", "totalValue": { "metricOption": "AGGREGATED_TOTAL", "timeDimension": { "timeRange": { "startTime": "2021-01-01T01:01:23.045123456Z", "endTime": "2021-04-30T23:59:59.045123456Z" } }, "value": "11" } } ] } ] }
La risposta contiene le metriche, in particolare:
- 1571 visualizzazioni del luogo su Google Maps
- 631 visualizzazioni di località su Ricerca Google.
- 3 richieste di indicazioni stradali per raggiungere la località.
- 42 clic sull'offerta di
LOCAL_POST_ACTIONS_CALL_TO_ACTION
. - 11 visualizzazioni di post locali nella Ricerca Google.
Un'altra opzione per le metriche prevede l'utilizzo di Prenota con Google per creare link di azione. Quando gli utenti fanno clic sui link di azione creati in Prenota con Google, puoi accedere queste azioni a Google Analytics, che ti consente di monitorare le conversioni in Google Analytics. Consulta le documentazione sul monitoraggio delle conversioni per ulteriori informazioni.
Indipendentemente dalla strategia per le metriche che utilizzi, la misurazione è molto più che verificare il tuo rendimento rispetto ai tuoi KPI. Le cifre aiutano anche a comprendere l'impatto di questi localizzatori che i miglioramenti hanno sulla tua attività. Inoltre, puoi confrontare le metriche di Google Analisi sul tuo locator con le metriche del profilo dell'attività. Ad esempio, confrontando queste metriche, puoi vedere quanti clienti ricevono indicazioni stradali dal tuo locator Google Maps per poi visitare le tue sedi fisiche.
Miglioramento di Locator Plus in corso...
In base al tipo di attività o l'account degli utenti al fine di migliorare ulteriormente l'esperienza dell'utente.
Invio di indicazioni stradali al dispositivo mobile
Per consentire agli utenti di raggiungere una località più facilmente, puoi inviare messaggi o email un link alle indicazioni stradali. Quando gli utenti fanno clic, l'app Google Maps viene avviata sul loro sul telefono se è installato, oppure maps.google.com verrà caricato nel browser web del dispositivo. Entrambe queste esperienze offrono all'utente la possibilità di utilizzare la navigazione passo passo, inclusa la guida vocale, per raggiungere la destinazione.
Utilizza
URL di Maps per comporre un URL delle indicazioni stradali come il seguente, con
Nome del luogo codificato nell'URL come parametro destination
e ID luogo come
destination_place_id
. Non sono previsti costi per la scrittura o l'utilizzo
Maps, quindi non è necessario includere una chiave API nell'URL.
https://www.google.com/maps/dir/?api=1&destination=Google%20London&destination_place_id=ChIJVSZzVR8FdkgRTyQkxxLQmVU
Facoltativamente, puoi fornire un parametro di query origin
utilizzando lo stesso indirizzo
formato di destinazione. Se invece la ometti, le indicazioni stradali partono dal nome attuale dell'utente
di Google, che potrebbe essere diversa da quella in cui ha utilizzato l'app Locator Plus.
URL di Maps
forniscono opzioni aggiuntive per i parametri di query, come travelmode
e
dir_action=navigate
per avviare le indicazioni stradali con la navigazione attivata.
Questo link cliccabile, che estende l'URL di esempio riportato sopra, imposta il origin
come stadio di calcio di Londra e usa travelmode=transit
per fornire
indicazioni stradali con il trasporto pubblico per raggiungere la destinazione.
Per inviare un SMS o un'email contenente questo URL, al momento ti consigliamo di utilizzare una piattaforma di terze parti di applicazioni come twilio. Se utilizzi App Engine, puoi ricorrere a società di terze parti per inviare messaggi SMS o email. Per ulteriori informazioni, vedi Invio di messaggi con Servizi di terze parti.
Visualizzazione di Street View per aiutare gli utenti a visualizzare la località
In molte località del mondo, Street View può essere utilizzato per visualizzare l'esterno di una sul luogo, offrendo agli utenti una visuale del luogo prima di arrivare. Puoi fornire Street View in una interattivo (web) o statica (API) modulo, a seconda che tu voglia che gli utenti "si guardino" intorno nell'area 360 gradi. Street View è disponibile anche per Android e iOS.
Determinazione della posizione dell'utente con la geolocalizzazione
Nella maggior parte dei casi, puoi individuare la posizione dell'utente utilizzando i servizi di geolocalizzazione integrati sui loro dispositivi o browser. Forniamo un esempio utilizzando la funzionalità di geolocalizzazione HTML5 di un browser per visualizzare la posizione geografica un utente o un dispositivo su una mappa Google ed è disponibile la documentazione relativa alla richiesta di autorizzazioni e ottenere la posizione . Android e iOS. Tuttavia, potrebbero esserci delle situazioni in cui potresti volere un'alternativa rilevamento della posizione; Ad esempio, se i servizi di geolocalizzazione del dispositivo sono disattivati o hai problemi di spoofing della posizione del dispositivo.
Lo L'API Geolocation è un'API lato server che restituisce dati relativi alla posizione e all'accuratezza in base alle informazioni su torri cellulari e nodi Wi-Fi che il client può rilevare. Puoi utilizzare la geolocalizzazione come meccanismo di riserva per determinare posizione dell'utente oppure puoi utilizzarla per eseguire un controllo incrociato sulla posizione segnalata dal dispositivo.
Combinazione dei dati sulla posizione personalizzati con Place Details
Nella sezione precedente Fornire i dettagli del luogo, di cui abbiamo parlato utilizzando Place Details per offrire agli utenti un'ampia gamma di Informazioni sulle tue sedi, ad esempio orari di apertura, foto e recensioni.
È utile comprendere costo di dati diversi in Place Details, classificati come dati di base, contatto e ambiente. Per gestire i costi, una strategia consiste nel combinare le informazioni di cui già disponi le tue sedi con le informazioni aggiornate (di solito i dati di base e di contatto) di Google Mappe come chiusura temporanea, orario festivo e valutazioni, foto e recensioni degli utenti. Se disponi già dei dati di contatto per le tue sedi, non dovrai richiederli questi campi da Place Details e puoi limitare la richiesta al recupero solo dei dati di base I campi Dati ambiente dipendono da ciò che vuoi visualizzare.
Potresti avere i tuoi dati dei luoghi da integrare o utilizzare al posto di Place Details. La codelab per il localizzatore full stack offre un esempio di utilizzo di GeoJSON con un database per memorizzare e recuperare i dettagli della tua posizione.