Google mette a disposizione una API gratuita per l’autocompletamento in tempo reale della località inserita dall’utente
Prendiamo un form input HTML
<input id="input" type="text" style="width:500px;" />
Includiamo le Google Maps API nell’head della pagina html:
<script type="text/javascript" src='http://maps.google.it/maps/api/js?sensor=false&libraries=places'></script>
L’API da utilizzare è google.maps.places.Autocomplete() e richiede in ingresso il form html sul quale applicare l’autocompletamento:
<script>
function init()
{
var input = document.getElementById('input');
var autocomplete = new google.maps.places.Autocomplete(input);
}
google.maps.event.addDomListener(window, 'load', init);
</script>
A questo punto digitando qualcosa nel form comparirà il popup con le possibili scelte. Da notare che il popup ha stessa larghezza del form al quale è agganciato.
CIao Gianluca …
per caso sapresti dirmi come posso personalizzare i risultati che escono quando comincio a scrivere qualcosa nel campo di autocompletamento ?
adesso se scrivo qualcosa escono i nomi proposti da Google … perchè se si scrive ROMA escono :
-Roma RM, Italia
-Roma Italia
posso aggiungerci per esempio se uno scrive appunto ROMA escano :
Roma RM, Italia ( città )
Roma Italia (Regione)
Grazie
Ciao Emanuele,
qui trovi tutta la lista di parametri da specificare nella URL per formattare i risultati come vuoi:
https://developers.google.com/places/web-service/autocomplete#place_autocomplete_responses
io però sto usando semplicemente AUTOCOMPLETE
preso da qui :
https://developers.google.com/maps/documentation/javascript/places-autocomplete
esempio : https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete-addressform
ma il mio intento è quello di personalizzare i valori che escono dall’autocomplete e non di filtrarli a priori .
cioè aggiungere una stringa aggiuntiva ai nomi che mi vengono proposti, e non .
In questo caso devi scendere più a basso livello ed usare l’autocompleteService messo a disposizione sempre nelle Google maps API:
https://developers.google.com/maps/documentation/javascript/places#place_autocomplete_service
Devi registrare un listener nel form di testo dove l’utente scrive l’indirizzo con la callback che prende il testo corrente e lo passa all’autocompleteService. Questo servizio ti restituisce la lista dei suggerimenti come oggetti JSON che puoi poi manipolare come vuoi. Ti crei la tua lista di suggerimenti personalizzati utilizzando i componenti base restituiti dall’autocompleteService e poi passi questa lista di stringhe al dropdown nella pagina web
Questa pagina non carica correttamente Google Maps. A me risponde cosi…..
Ciao gianluca, ho generato una api key, e volevo sapere se avevi possibilita di aiutarmi per inserire un autocompletamento degli indirizzi stradali di google map in una cella di excel!!! grazie in anticipo
Ciao Alessandro, volentieri ma dovresti spiegarmi meglio cosa intendi fare. L’autocompletamento Google API è in ambito web (HTML+Javascript) non riguarda Excel direttamente. Cosa intendi esattamente per “inserire un autocompletamento degli indirizzi stradali di google map in una cella di excel” ? 🙂 Grazie!
Ciao Gianluca,
semplice e diretto. Grazie!
Voglio aggiungere il mio contributo e fare una domanda.
– Se si vuole fare in modo che google ci risponda nel formato di indirizzo e i nomi delle città in italiano, dobbiamo aggiungere alla chiamata alla libreria il parametro language=it. Quindi diventa una cosa del tipo
https://maps.google.it/maps/api/js?key=QUI_CI_VA_LA_KEY&libraries=places&language=it
– vorrei fare in modo che l’indirizzo suggerito, contenesse anche il cap; non riesco a trovare niente nella documentazione. Sai se è possibile e come si fa?
Ciao Diego, certamente!
devi specificare quali elementi dell’indirizzo vuoi, esiste un parametro specifico da passare nell’URL come hai fatto per la lingua. Puoi formattare l’indirizzo come vuoi, più o meno come si fa per le date. Vedi i dettagli qui:
https://developers.google.com/places/web-service/details#fields
Ciao Gianluca, tu sei un professionista io un semplice privato che sta cercando di farsi un sito dignitoso e vorrei appunto visto l’argomento, dare la possibilita all utente trovare una via precisa grazie all’aiuto di google maps…ma non so cosa e come devo fare.
grazie
luca
Ciao Luca, possiamo studiare una soluzione! mandami una email in privato a gianluca.ghettini@gmail.com e saprò sicuramente aiutarti! ciao grazie