-
Mappe
Come inserire una mappa tipo quella di google maps in una pagina html?
-
Dunque, piccola premessa prima di iniziare con il codice necessaro:
- occorre innanzi tutto avere una API Key, un codice alfanumerico che identifica l'URL del sito per il quale si richiede il servizio. Cerca in Google la pagina "Sign up for google maps API" ed al suo interno indica l'URL per il quale ti occorre il servizio. Clicca *Generate API Key *copiala e prendine nota (notepad).
- codice da inserire nella sezione <head> </head>Mantenendo aperto il tuo bel notepad, apri in una pagina web Google Maps e centrati sull'indirizzo stradale che vuoi si apra in quella che sarà la mappa nel tuo sito. (es: Roma, via tal dei tali...)
Fai caso che nella pagina di Google Maps che stai guardando c'è un link denominato "Collegamento a questa pagina". Apri quel link e troverai al suo interno due valori numerici, separati da una virgola. Tali numeri rappresentano latitudine e longitudine del punto geografico che hai focalizzato sulla mappa.
(es: http://maps.google.com/maps?f=...ll=41.896655,12.495918...om=1)
(lat. **41.896655 **long. 12,495918) copiali nel tuo notepad.
Inserisci quindi questa stringa sempre nella sezione <head> </head>.
<script src="http://maps.google.com/maps?file=api&v=2&key=API-KEY" type="text/javascript"></script> sostituendo API-KEY con la tua API-KEY che hai precedentemente copiato ed incollato in notepad.
Ora inserisci quest'altra stringa:
<script type="text/javascript">
//<![CDATA[
function showMap()
{
if (GBrowserIsCompatible()) {
// Ottiene l'elemento della pagina chiamato "map"
// crea la mappa utilizzandolo come contenitore.
var map = new GMap2(document.getElementById ("map"));// Aggiunge i controlli per zoom e spostamento
map.addControl(new GSmallMapControl());// Sostituisci quì sotto i valori numerici tra parentesi con le tue lat. e long.
// Il numero 5, rappresenta lo zoom, modificalo secondo il tuo valore
map.setCenter(new GLatLng(41.896655,12.495918), 5);
}
}
//]]>
</script>-
codice da inserire nel tag <body>cerca il tag <body> e tralasciando gli elementi già presenti, aggiungi le istruzioni necessarie ad informare come gestire la mappa durante il caricamento e lo scaricamento della stessa.
Aggiungi quindi.. onload="showMap();" onunload="GUnload()">
(es: <body onload="showMap();" onunload="GUnload()">) -
codice da inserire nella sezione <body> </body>Nel punto della pagina web che stai programmando, dove vuoi appaia la mappa, inserisci questa semplicissima stringa "div" che altro non fa se non inserire appunto la stessa o nel caso di javascript del browser disabilitato, far apparire la dicitura che vedi sotto:
<div id="map">
Your browser doesn't support Google Maps or Javascript is turned off.
</div>
Questo è quanto necessario, fatto il tutto, salva e buona visione...
-
io ti ringrazio, metto in pratica quantomi hai detto e ti faccio sapere
-
Ma sei nellamappa dovessi inserire una serie strutture, come posso fare?
Grazie 1000