Visualizzare sul proprio sito
un indirizzo con Google maps
Vedremo in questo script come inserire nel proprio sito una mappa personalizzata prelevata da google maps. Nell'esempio Script ajax: Inserire una mappa di google maps nel proprio sito abbiamo visto come inserire una mappa e visualizzare un punto inserendo le coordinate della zona da visualizzare. In questo esempio vedremo invece come visualizzare nella mappa un indirizzo, inserendo non le coordinate, ma più semplicemente l'indirizzo stesso, comprendente via, città e numero civico.
Vi ricordo di prelevare una API Key da
http://www.google.com/apis/maps/signup.html
(per maggiori info riguardate Script ajax: Inserire una mappa di google maps nel proprio sito)
Attraverso Geocoder vediamo ora come modificare lo script visto in precedenza per poter visualizzare un indirizzo con le mappe di google sul nostro sito.
Avremo in particolare due funzioni. La funzione load() caricherà la mappa. Visualizzando un punto iniziale. Ad esempio la visualizzazione di tutta l'Italia. Con la funzione showAddress() andremo a posizionarci in un punto preciso, all'indirizzo richiesto.
Vediamo lo script completo:
.........................
La funzione load() la abbiamo già spiegata qui, carichiamo la mappa e la centriamo su Roma, zoom 5, quindi visualizziamo tutta l'Italia.
Alla funzione showAddress() passiamo l'indirizzo, ad esempio Via Rosmini Antonio, 9, 00184 Roma (RM), Italy.
Se non viene trovato l'indirizzo (attenzione a scriverlo in un formato corretto) viene visualizzato un alert con un errore:
if (!point) {
alert(address + " not found");
}
altrimenti viene visualizzato il punto cercato a zoom 16:
map.setCenter(point, 16);
volendo possiamo visualizzare un segnaposto per la via
var marker = new GMarker(point);
map.addOverlay(marker);
E addirittura un fumetto con il nome del posto:
marker.openInfoWindowHtml('Ristorante xxxx');
o della via:
marker.openInfoWindowHtml(address);
Post
