Add Google Maps
Ecco a voi un javascript tutto completo per inserire le mappe di google in una pagina web. il codice risulta del tutto valido e in assenza di javascript attivato gli indirizzi risultano visibili.
Il codice javascript contiene tutta la spiegazione per usarlo:
I campi modificabili per la personalizzazione della mappa sono:
- apicode - apicode della mappa, si ricava dal sito della google
- idfrommaps - ID del div di contenimento della mappa
- mapscontroll - Controlli della mappa (0 - disattivo, 1 - piccolo, 2 - larghi, 3 - solo zoom)
- mapsoptions - Tipologie della mappa, mappa satellite o ibrida ( 0 - disattivo, 1 - attivo)
- mapscale - Scala della mappa (0 - disattivo, 1 - attivo)
- mapsnavi - Navigatore in basso a destra (0 - disattivo, 1 - attivo)
- mapscroll - Zoom della mappa con la rotellina del mouse (0 - disattivo, 1 - attivo)
- zoomlevel . Livello iniziale di zoom (13 - citta, 16 - strada)
Il codice html per utilizzarlo invece è:
<div id="map">
<p class="address">corso vittorio emanuele II 11, Roma</p>
<p class="latlong">41.895473,12.480597</p>
</div>In pratica il javascript cerca determinati paragrafi di testo nel div indicato come contenitore della mappa.
Ci sono 2 classi da usare per questi paragrafi:
- address - Paragrafo contenente un indirizzo, basta solo scrivere dentro l’indirizzo che si vuole segnare sulla mappa, il marker è di default
- latlong - Paragrafo contente latitudine e longitudine per da segnare, non ha il marker di default (separare latitudine e longitudine con una ,)
Per attivare il codice inserire in onload:
showmaps();
Per poter invece richiamare punti multipli o punti con la nuvoletta bisogna usare la seguente funzione javascript:
showaddress(indirizzo, marker, nome-tab, contenuto-tab, apertura);
La sintassi è la seguente:
- indirizzo - indirizzo che si vuole evidenziare sulla mappa
- marker - true/false - attiva il segnaposto grafico
- nome-tab - nome della nuvoletta (richiede che marker sia true)
- contenuto-tab - testo della nuvoletta (richiede che marker sia true)
- apertura - true/false - apertura della nuvoletta in automatico (richiede che marker sia true)
Scarica Add Google Maps
4 commenti
dok dice:
28 Ottobre 2007 alle 11:52
this one is simple & nice.
website »
Angelo dice:
1 Luglio 2008 alle 10:11
Ciao Eduardo, sono il solito Angelo di vivarovere. L’ altra volta, quando mi hai aiutato, mi sono un po’ riguardato questo sito, ed ho trovato utile questo javascript di google maps. Vorrei inserirlo in una Pagina di Wordpress… come faccio? Io ho preso il js e uploadato nella root, editato l pagina inserendo il codice che hai indicato. Come previsto, non funge. Potresti darmi qualche istruzione aggiuntiva? Grazie
website »
Angelo dice:
1 Luglio 2008 alle 10:15
Ah, considera che la mia è una situazione un po’ particolare… Il dominio è hostato su dreamhost, ho fatto una installazione one-click easy di wordpress, il che vuol dire che sul mio spazio web non è stato installato alcun file. Non so se questo può fare la differenza..
website »
Eduardo dice:
1 Luglio 2008 alle 12:38
Usarlo è semplice:
1. Includi il codice con il tag <script type=”text/javascript” src=”tuolinkdeljs”></script>
2. Aggiungi all’onload showmaps(); se non ne hai uno inseriscilo sotto l’inclusione usando window.onload
3. Metti il codice html (l’indirizzo metti quello che vuoi, ma cerca su maps.google.it quello preciso che ti serve) che c’è nella pagina sopra, et voilà, se hai fatto tutto giusto la mappa funzina automaticamente. Aggiungo solo che i P interni possono essere uno o più di uno senza problemi. Non devono essere per forza quelli che ho scritto io.
website »