Come utilizzare Google Maps API per auto completo Luogo campi

January 8

Interagisci con i visitatori del tuo sito web, consentendo loro di entrare in una posizione specifica sulla vostra abitudine Google Map. Utilizzando l'API di Google Maps versione 3, è possibile creare un campo di testo per gli utenti di inserire un indirizzo o ragione sociale. Sulla base del testo inserito, Google Maps offrire suggerimenti e auto-completare il campo. Si aggiunge la funzione "Luoghi completamento automatico" per la vostra abitudine Google Map utilizzando il costruttore "completamento automatico".

istruzione

1 Accedi al tuo file HTML e individuare il codice di Google Maps.

2 Definire la variabile per l'input dell'utente dopo il codice di inizializzazione mappa. Ad esempio, digitare:

var user_imput = document.getElementById ( 'searchTextField');

3 Specificare le opzioni per i dati di input. Le opzioni includono l'impostazione dei limiti, che limita la latitudine e longitudine per la ricerca completamento automatico, e l'impostazione del tipo di ingresso, che permette all'utente di cercare da un nome o un indirizzo geocode. Ad esempio, digitare:

var options = {
limiti: defaultBounds,
tipi: [ 'geocode']
};

In questo esempio, gli utenti possono cercare per indirizzo e la gamma o il limite predefinito è illimitato.

4 Creare il controllo completamento automatico. Ad esempio, digitare:

userAutocomplete = new google.maps.places.Autocomplete (input, opzioni);

5 Modificare l'etichetta per il campo di inserimento nel codice HTML. Ad esempio, digitare:

<Input id = tipo "searchTextField" = "text" size = "50" segnaposto = "Inserire una posizione:">

6 Salvare il file e provarlo. Google Maps controlla il campo di inserimento e auto-completa il campo quando un utente inizia a digitare.