Un segnalino su google Maps spostabile con aggiormento AJAX delle coordinate satellitari

22 Maggio 2008 by

Giovanni | Argomenti: none | 6022

Negli articoli riguardanti google maps abbiamo visto, tra l’altro, come inserire una cartina di google maps partendo dalle coordinate satellitari e anche avendo solo l’indirizzo.

Proviamo invece a fare un programma più complesso per il calcolo delle coordinate satellitari muovendo il cursore sulla mappa e memorizzazione su server grazie ad AJAX.

Per fare questo dovremmo usare:

google maps e le sue funzioni
un po’ di javascript
ajax per inviare al server le coordinate
un semplice programma php che salvi le coordinate satellitari sul server

Ecco quindi il codice javascript da inserire subito dopo l’include del codice google maps (con relativa chiave) ottenibile sul sito di google maps.

<script type="text/javascript">
//<![CDATA[

//
// PARTE AJAX
//
var xmlhttp = false;
var xml2 = false;

/*@cc_on @*/
/*@if (@_jscript_version >= 5)
try {
  xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
  xml2 = new ActiveXObject("Msxml2.XMLHTTP");
  } catch (e) {
  try {
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    xml2 = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (E) {
    xmlhttp = false;
    xml2 = false;
    }
}
@end @*/

if (!xmlhttp && typeof XMLHttpRequest != "undefined") 
{
  xmlhttp = new XMLHttpRequest();
}

if (!xml2 && typeof XMLHttpRequest != "undefined") 
{
  xml2 = new XMLHttpRequest();
}

//
// Funzione che si occupa di fare la richiesta AJAX
// allo script che materialmente effettuerà l'operazione
//
function ajax(serverPage, objID) 
{
  // Div dove finirà il risultato
  var obj = document.getElementById(objID);

  // Apre connessione
  xmlhttp.open("GET", serverPage);

  // Stampa risultato se tutto è ok
  xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
    {
      obj.innerHTML = xmlhttp.responseText;
    }
  }
  xmlhttp.send(null);
}

//
// SEZIONE GESTIONE MAPPA
//
  
// VARIABILI GLOBALI
var map = null;
var geocoder = null;
var marker = null;

//
// CREA IL SEGNALINO
//
function createMarker(point)
{
  if (marker != null)
    marker.remove();
  marker = new GMarker(point, {draggable: true});
    
  GEvent.addListener(marker, "dragend", function() {
    // Chiamata AJAX che sposta il puntatore
    ajax("/ajaxsave.php?ps=setmappa&lat=" +
       marker.getLatLng().y + "&long=" + marker.getLatLng().x,
      "querybox");
    });

  return marker;
}

//
// Traduce indirizzo inserito in coordinate tramite GeoCoder
//
function showAddress(address) 
{
geocoder.getLatLng(address,
  function(point)
  {
    if (!point)
    {
      alert(address + " non trovato!");
    }
    else
    {
      if (address == 'Roma')
        map.setCenter(point, 6);
      else
        map.setCenter(point, 16);
      ajax("/ajaxsave.php?ps=setmappa&lat=" +
        point.lat() + "&long=" + point.lng(),
        "querybox");
      // Crea il marker
      map.addOverlay(createMarker(point));
    }
  });
}
   
//
// FUNZIONE DA METTERE NELL'Onload del BODY
//
function load() 
{
if (GBrowserIsCompatible()) 
  {
  // Crea mappa
  map = new GMap2(document.getElementById("map"));
  // Creo GeoCoder
  geocoder = new GClientGeocoder();
  
  // VISUALIZZA L'INDIRIZZO DI PARTENZA
  showAddress("Roma");

  // Visualizza controlli - TIPO MAPPA
  map.addControl(new GMapTypeControl());
    
  // Visualizza controlli - ZOOM GRANDE
  map.addControl(new GLargeMapControl());
  }
}
//]]>
</script>

Nel codice dove è presente la funzione: showAddress(”Roma”); è possibile inserire qualsiasi indirizzo, se google lo riconoscerà valido ci centrerà la mappa su quell’indirizzo e ci inserirà un segnalino.

Prima di concludere bisogna modificare il body:

<body onload="load()" onunload="GUnload()">

E infine inserire il blocco della mappa, il form per l’inserimento dell’indirizzo e il div dove verranno visualizzate le coordinate, nel punto del proprio sito che si desidera:

<div align="center">
  <div id="map" style="width: 600px; height: 450px;"></div>
</div>
<form id="mod_geo" action="#"
onsubmit="showAddress(document.getElementById('mod_geo').indirizzo.value);return false">
  <div id="modulo">
    <strong>Indirizzo:</strong>
    <input id="indirizzo" type="text" size="60" value="Inserire indirizzo" />
    <input name="cerca" type="submit" value="Cerca!" />
  </div>
</form>

<div id="querybox">Posizionare struttura nella mappa!</div>

Avremo ottenuto una mappa satellitare con un segnalino spostabile.

A questo punto se si guardano le chiamate ajax nel codice si vedrà che viene chiamato un programma (residente su server) di nome ajaxsave.php. Vediamo cosa fa:

<?php

$ps = ($_REQUEST['ps'] != "" && isset($_REQUEST['ps'])) ? $_REQUEST['ps'] : "";

if ($ps == "setmappa")
  {
  $longitudine = arrL($_REQUEST['long']);
  $latitudine = arrL($_REQUEST['lat']);
  // QUI POSSO, AD ESEMPIO, INSERIRE SU DB
  
  // MESSAGGIO DA METTERE NEL BOX
  echo "Coordinate: latitudine $latitudine, longitudine $longitudine";
  }

?>

In pratica riceve in input le coordinate e fa un echo di un messaggio che sarà visualizzato nel box sottostante la mappa sul client.

Infine, un tocco di CSS:

#querybox {
  text-align: center;
  background-color: white;
  color: black;
  border: 1px solid green;
  padding: 0.5em;
  margin: 1em 5em 0.5em 5em;
  }

Il risultato lo potete vedere qui, un programma per il calcolo delle coordinate satellitari!

Pubblicato in Di google un po', Google Maps |

47 Commenti a “Un segnalino su google Maps spostabile con aggiormento AJAX delle coordinate satellitari”

SyGy scrive:
17 Giugno 2008 alle 21:18
Ciao! oddio super ottima guida. Vorrei creare anche io una cosa del genere, però vorrei ottimizzare un pò questo già splendido script.
Allora vorrei sapere come posso fare a far uscire l\’output della longitudine e della latitudine in un form. Cioè quindi io vorrei creare una mappa con la quale i miei utenti possono cercare il proprio indirizzo, impostare bene il segnalino ed scrivere una descrizione del maker che si aprirà cliccando su di esso. Tutto questo dovrà essere salvato su un DB MySQL. Cioè non so se mi son fatto capire bene. Allora gli utenti cercano una strada, il segnalino si posiziona sulla via, e l\’utente lo può spostare per inserire bene il segnalino, mentre lo sta muovendo le coordinate satellitari dovranno essere inserite rispettivamente in un form \
Giovanni scrive:
18 Giugno 2008 alle 04:52
Premesso che questo fa esattamente quello che dici tu ma con ajax, quindi in maniera più amichevole, su DB già salva le coordinate e aggiungere un campo è banale, fare come chiedi tu è ancora più semplice.
Basta che dove trovi il codice:
```
ajax("/ajaxsave.php?ps=setmappa&lat=" +
        point.lat() + "&long=" + point.lng(),
        "querybox");
```
lo sostituisci per scrivere nei tuoi campi, ossia qualcosa del tipo:
```
document.getElementById("latitudine").value = point.lat();
document.getElementById("longitudine").value = point.lng();
```
SyGy scrive:
18 Giugno 2008 alle 20:15
Ciao Giovanni scusa ancora per il disturbo. Allora beh come dici tu funziona, però con la mia poca esperienza in materia di ajax e php, ho capito che facendo ciò si esclude completamente il file in PHP. Ma però c\’è un piccolo problema, cioè le coordinate le vedo, ma una volta che vado a spostare il cursore, le coordinate non cambiano. Come se non ci fosse la trasmissione dei dati una volta che sposto il puntatore!
Poi ancora una piccola cosa ma come faccio a dirgli ad ajax di salvare i punti nel database mysql?
Scusa per la rottura ma solo te puoi aiutarmi.
Giovanni scrive:
19 Giugno 2008 alle 05:58
Nel file ajaxsave.php c’è un commento che dice:
```
// QUI POSSO, AD ESEMPIO, INSERIRE SU DB
```
Lì devi fare le tue operazioni.

Invece per il discorso di cambiare i valori quando sposti, hai modificato tutte e 2 le ajaxsave? Ce n’è una per il puntamento e una per lo spostamento. Controlla!
SyGy scrive:
19 Giugno 2008 alle 14:57
No vabbè ho provato ma non ci riesco! lascio stare non ti preoccupare.
6 stato gentilissimo!
Ciao!

Luca scrive:
13 Luglio 2008 alle 16:46

grazie per questa interessantissima guida
sto tentando di fare la stessa cosa di SyGy:
ho messo nella pagina un form con i due campi latitudine e longitudine, e modificato le due chiamate ajax:

GEvent.addListener(marker, "dragend", function() {
    // Chiamata AJAX che sposta il puntatore
    ajax("/ajaxsave.php?ps=setmappa&amp;lat=" + marker.getLatLng().y + "&amp;long=" + marker.getLatLng().x, "querybox");
    });
  return marker;

IN:

GEvent.addListener(marker, "dragend", function() {
    // Chiamata AJAX che sposta il puntatore
document.getElementById("latitudine").value = point.lat();
document.getElementById("longitudine").value = point.lng();
    });
  return marker;

e l’altra chiamata:

map.setCenter(point, 16);
      ajax("/ajaxsave.php?ps=setmappa&amp;lat=" + point.lat() + "&amp;long=" + point.lng(), "querybox");
      // Crea il marker

IN:

map.setCenter(point, 16);
document.getElementById("latitudine").value = point.lat();
document.getElementById("longitudine").value = point.lng();
// Crea il marker

Ma ho lo stesso problema: in fase di caricamento della mappa mi indica correttamente le coordinate nei due campi, ma spostando il segnalibro le coordinate non vendono aggiornate….
Puoi farmi qualche ulteriore indicazione?
grazie 1000
luca

Giovanni scrive:
13 Luglio 2008 alle 18:33
Nella prima chiamata occorre mettere marker.getLatLng().y e marker.getLatLng().x al posto di point.lat() e point.lng()
Luca scrive:
13 Luglio 2008 alle 19:29
Non funziona…
ho corretto il codice come mi hai indicato ma non mi aggiorna le coordinate….
La parte di codice ora è cosi:

[code]
//
// CREA IL SEGNALINO
//
function createMarker(point)
{
if (marker != null)
marker.remove();
marker = new GMarker(point, {draggable: true});

// Chiamata AJAX che sposta il puntatore

document.getElementById(”latitudine”).value = marker.getLatLng().y;

document.getElementById(”longitudine”).value = marker.getLatLng().x;

return marker;
}
[/code]

Mi viene un dubbio: ma oltre al file html devo caricare qualche altro file sul sito?
non appoggiandosi piu al file php non ho caricato nessun altro file…
grazie per il tuo aiuto,
questa utility mi sarebbe veramente utile…
luca
Giovanni scrive:
13 Luglio 2008 alle 20:04
Esistono i due campi con id=”latitudine” e id=”longitudine”? Attenzione a non confondere id con name.
Massimo scrive:
13 Luglio 2008 alle 22:00
Ciao, complimenti per la guida. Io vorrei avere il risultato inverso, ovvero dal database con php prendo la città, l\’ indirizzo ed il nome dell\’ utente e poi visualizzare tutti i segnalini contemporaneamente con ognuno il nome dell\’ utente sulla finestra che si apre quando clicchi sopra il segnalino.

Io sto usando solo javascript e non ho capito come passare i dati del database allo script.
Luca scrive:
14 Luglio 2008 alle 13:48
si, i campi hanno name e id uguale, uno longitudine e
il secondo latitudine.
se vuoi vedere la pagina in oggetto è a questo link:
test.intheweb.it/coordinate.html
grazie
luca
Giovanni scrive:
15 Luglio 2008 alle 05:49
Per Luca: hai tagliato un pezzo, dovrebbe essere così:
```
  GEvent.addListener(marker, "dragend", function() {
    document.getElementById("latitudine").value = marker.getLatLng().y;
    document.getElementById("longitudine").value = marker.getLatLng().x;
    });
```
In pratica devi settare le coordinate in caso di dragend!

Per Massimo: il programma PHP deve leggere gli indirizzi e creare la pagina HTML / JAVASCRIPT, in pratica deve fare tante showAddress(address);
Luca scrive:
15 Luglio 2008 alle 13:45
vero….adesso funziona perfettamente…
grazie mille per la tua guida e per
il tuo supporto, a buon rendere
luca
andrea scrive:
13 Agosto 2008 alle 13:31
ciao io ti volevo chiedere… è possibile, con le api di google map.. impostare un punto predifinito… che puoi essere la via dei lupi canterini, e con un form… dare la possibilità alle persone di digitare il prioprio indirizzo.. cosi che l’inidirizzo di arrivo sia sempre lo stesso.. è quello di partenza sia tutte le volte diverso ??!! se si come perche io ho cercato il modo.. ho visto anche in giro siti che lo avevano. ma al momente non mi serviva e non ci ho fatto caso. cmq grazie mille… grazie puoi anche rispondere alla mail indicata
Giovanni scrive:
16 Agosto 2008 alle 11:43
Non mi risulta che nelle api di google maps siano già stati implementati i percorsi, si può facilmente tracciare una linea dritta tra un punto predefinito e un altro indirizzo.
franz scrive:
4 Settembre 2008 alle 15:43
Ciao!

complimenti per l\’ottimo script.
Non riesco a introdurre una modifica: al posto di un cursore draggabile, un po\’ scomodo perchè si perde con lo zoom, vorrei inserire la possibilità di cliccare sulla mappa, posizionare il nuovo cursore e cancellare quello precedente. Hai una soluzione?
luca scrive:
17 Novembre 2008 alle 18:27
nel codice, con showAddress imposti la località di partenza dove posizionare il marker.
Se invece volessi posizionarlo su determinate coordinate lat-lon come devo fare?
Questo perchè vorrei passarle in modo dinamico.
Ho gia provato in questo modo
showAddress(<%=rs(\
luca scrive:
17 Novembre 2008 alle 18:27
chiedo scusa…mi ha troncato una parte del messaggio:

nel codice, con showAddress imposti la località di partenza dove posizionare il marker.
Se invece volessi posizionarlo su determinate coordinate lat-lon come devo fare?
Questo perchè vorrei passarle in modo dinamico.
Ho gia provato in questo modo
showAddress(, );
e per la latitudine va bene, mentre la longitudine la tronca in modo anomale: ad es. se lon è pari a 8,34566776 mi piazza il marker a 7 tondi…perchè?
grazie
luca
luca scrive:
17 Novembre 2008 alle 18:29
non riesco a postare il codice…ora riprovo

nel codice, con showAddress imposti la località di partenza dove posizionare il marker.
Se invece volessi posizionarlo su determinate coordinate lat-lon come devo fare?
Questo perchè vorrei passarle in modo dinamico.
Ho gia provato in questo modo
[code]
showAddress(, );
[/code]
e per la latitudine va bene, mentre la longitudine la tronca in modo anomale: ad es. se lon è pari a 8,34566776 mi piazza il marker a 7 tondi…perchè?
grazie
luca
luca scrive:
17 Novembre 2008 alle 18:30
ultima volta…

nel codice, con showAddress imposti la località di partenza dove posizionare il marker.
Se invece volessi posizionarlo su determinate coordinate lat-lon come devo fare?
Questo perchè vorrei passarle in modo dinamico.
Ho gia provato in questo modo

showAddress(lat-dinamico, lon-dinamico);

e per la latitudine va bene, mentre la longitudine la tronca in modo anomale: ad es. se lon è pari a 8,34566776 mi piazza il marker a 7 tondi…perchè?
grazie
luca
Giovanni scrive:
17 Novembre 2008 alle 21:14
Credo che il problema sia la virgola, occorre usare come separatore dei decimali il punto, la virgola separa i parametri delle funzioni.
luca scrive:
18 Novembre 2008 alle 17:37
ma io uso il punto come separatore dei decimali…
le coordinate sono quelle rilevate dallo script e che memorizzo nel recors. Quando modifico il record, vorrei che il marker partisse già dalle coordinate precedentemente rilevate e non sul punto di default.
Per questo passo i parametri lat e lon, separandoli dalla virgola. ma i valori sono con il punto ad es. 45.5656565656 e 8.232323.
Il primo viene arrotondato a un valore inferiore ma è cmq valido, ad es. 45.5656 mentre il secondo viene arrotondato a 7, sballando del tutto le coordinate.
luca
Giovanni scrive:
19 Novembre 2008 alle 07:35
Facendo “sorgente pagina” cosa appare come numero, hai un link da postare per controllare il problema?
luca scrive:
19 Novembre 2008 alle 17:04
come prima cosa è stato stampare a video i parametri che passa come lat e lon e sono corretti.
guardando il sorgente della pagina, nella parte dove imposta lo showaddress viene indicato cosi:

showAddress(45.322219956396964, 8.864593505859375);
pertanto mi sembra corretto, a parte il numero esagerato di decimali.
come detto, il primo valore viene indicato correttamente mentre il secondo viene arbitrariamente arrotondato a 7…
grazie
luca
Giovanni scrive:
19 Novembre 2008 alle 20:57
showAddress è fatta per prendere una località, per inserire un pallino è sufficiente la createMarker(point); dove point può essere il risultato di una getLatLng().
Un semplice esempio lo si trova nella documentazione delle api di google maps: http://code.google.com/apis/maps/documentation/
luca scrive:
21 Novembre 2008 alle 13:27
so come creare un marker sulla mappa di google,
però volevo utilizzare il tuo codice, in modo da
poterlo spostare sulla mappa e leggerne le coordinate.
In pratica, se nel tuo codice volessi posizionare il marker
su un punto preciso, passando le coordinate lat e lon
invece che metterlo di default con lo showaddress,
come dovrei fare?
grazie luca
Giovanni scrive:
22 Novembre 2008 alle 07:23
E’ la funzione createMarker(point) (in questo esempio) ad aggiungere le funzionalità di spostamento del marker, in pratica il codice:
```
GEvent.addListener(marker, "dragend", function()
...
```
luca scrive:
23 Novembre 2008 alle 11:28
ho risolto…
per chi fosse interessato posto la soluzione:

basta aggiungere i parametri lat e lon in questo modo:

var point = new GLatLng(lat-da-recordset, lon-da-recordset);
map.setCenter(point, 13);

appena prima di

marker = new GMarker(point, {draggable: true});

e il marker si posiziona sulle coordinate prese dal database e il drag funziona correttamente.
Carlo scrive:
23 Novembre 2008 alle 23:12
Salve a tutti volevo chiedere a voi . Ho sentito dire che con uno script php e avendo tutti i nomi dei comuni italiani,attraverso googlemap di trovare tutte le coordinate dei comuni.
Credete che sia possibile? Qualcuno sa darmi una mano?
Giovanni scrive:
24 Novembre 2008 alle 06:44
Lo script di questo articolo fa proprio qualcosa di simile, nel load() dove viene passata “Roma”, si potrebbe semplicemente fare la chiamata (in php) a tutti i comuni.
anz scrive:
11 Dicembre 2008 alle 16:22
complimenti per l\’ottimo script! Ho provato invano ad inserire una variante: le coordinate vengono ricavate dal click del mouse sulla mappa, con conseguente riposizionamento del cursore, e non dal drag. Hai una soluzione?
nslusiano scrive:
28 Febbraio 2009 alle 17:01
Sottopongo il mio quesito. Supponiamo di inviare ad un amico il link ad un sito in cui appare la mappa del suo paese. Quando lui ci va, deve mettere un segnalino vicino alla sua abitazione e con un click mi deve inviare per posta l\’immagine del luogo completa di segnalino. In questo modo io so dove abita.
Si può fare?
Chi mi risponde tengo presente che parta da zero, anzi da sottozero
grazie
Giovanni scrive:
3 Marzo 2009 alle 06:30
Si può fare ma bisogna sviluppare un programma, addirittura la foto può inserirla lui direttamente da programma senza inviarla via mail. Ma senza conoscenze di programmazione è difficile.

Piuttosto se entrambi avete un google account potete andare su google maps e fare “le mie mappe”.
nslusiano scrive:
3 Marzo 2009 alle 18:13
Grazie della risposta. il consiglio di fare un account mi sembra la via più semplice. Ho visto in giro delle mappe che farebbero quello che chiedo io. ho provato a catturale ma il risultato ,anche se non pessimo, è questo. http://www.lift01.com/lift/mappa.htm
L\’unica cosa che non mi va bene è che per l\’invio della e-mail il mio amico dovrebbe avere outlook a bordo. preferirei invece che il messaggio venisse inviato da uno script simile a quello che si trova in \
nslusiano scrive:
3 Marzo 2009 alle 19:19
Mi sono mangiato un pezzo di messaggio, era: che si trova in:
le mie mappe di googlemap. Se vuoi puoi dirmi da dove iniziare a studiare questo tipo di programmazione.
ciao
Giovanni scrive:
3 Marzo 2009 alle 20:22
Allora, è sufficiente entrare in google maps, accedere con un account google (se non ce l’hai puoi crearlo al volo) e andare in “le mie mappe”.
Da lì creare una propria mappa è facilissimo!
Provare per credere
nslusiano scrive:
3 Marzo 2009 alle 22:57
hai visto il sito che ti ho indicato? si può fare qualche cosa di simile con un pò di programmazione? L’account ce l’ho e funziona. Tuttavia devo dare la password per entrare e questo non mi va. Mi piacerebbe fare come nella pagina che ti ho detto dove uno entra liberamente e mi manda per posta la mappa con il segnalino suo. Pensaci con calma, tanto io sono agli inizi.
ciao
vito scrive:
24 Marzo 2009 alle 15:15
Ho seguito passo passo la realizzazione dello script, nel box dove mi dovrebbe comparire le coordinate esce il seguente messaggio:

Fatal error: Call to undefined function arrL() in /home/web/newsite.pippo.it/website/ajaxsave.php on line 7

cosa ho potuto sbagliare??
Giovanni scrive:
24 Marzo 2009 alle 17:05
Effettivamente arrL() è una funzione che che arrotonda le coordinate, puoi toglierla e vedere i risultati.
vito scrive:
24 Marzo 2009 alle 18:00
Dove dovrei toglierle?
vito scrive:
24 Marzo 2009 alle 18:08
Per capirci ho realizzato un file php con il seguente codice:

Ricerca Coordinate Satellitari

//= 5)
try {
xmlhttp = new ActiveXObject(”Msxml2.XMLHTTP”);
xml2 = new ActiveXObject(”Msxml2.XMLHTTP”);
} catch (e) {
try {
xmlhttp = new ActiveXObject(”Microsoft.XMLHTTP”);
xml2 = new ActiveXObject(”Microsoft.XMLHTTP”);
} catch (E) {
xmlhttp = false;
xml2 = false;
}
}
@end @*/

if (!xmlhttp && typeof XMLHttpRequest != “undefined”)
{
xmlhttp = new XMLHttpRequest();
}

if (!xml2 && typeof XMLHttpRequest != “undefined”)
{
xml2 = new XMLHttpRequest();
}

//
// Funzione che si occupa di fare la richiesta AJAX allo script che materialmente effettuerï¿½ inserimento nel db
//
function ajax(serverPage, objID)
{
// Div dove finirï¿½ il risultato
var obj = document.getElementById(objID);

// Apre connessione
xmlhttp.open(”GET”, serverPage);

// Stampa risultato se tutto ï¿½ ok
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
{
obj.innerHTML = xmlhttp.responseText;
}
}
xmlhttp.send(null);
}

//
// SEZIONE GESTIONE MAPPA
//

// VARIABILI GLOBALI
var map = null;
var geocoder = null;
var marker = null;

//
// CREA IL SEGNALINO
//
function createMarker(point)
{
if (marker != null)
marker.remove();
marker = new GMarker(point, {draggable: true});

GEvent.addListener(marker, “dragend”, function() {
// Chiamata AJAX che sposta il puntatore
ajax(”/ajaxsave.php?ps=setmappa&lat=” + marker.getLatLng().y + “&long=” + marker.getLatLng().x, “querybox”);
});

return marker;
}

//
// Traduce indirizzo inserito in coordinate tramite GeoCoder
//
function showAddress(address)
{
geocoder.getLatLng(address,
function(point)
{
if (!point)
{
alert(address + ” non trovato!”);
}
else
{
if (address == ‘Roma’)
map.setCenter(point, 6);
else
map.setCenter(point, 16);
ajax(”/ajaxsave.php?ps=setmappa&lat=” + point.lat() + “&long=” + point.lng(), “querybox”);
// Crea il marker
map.addOverlay(createMarker(point));
}
});
}

//
// FUNZIONE DA METTERE NELL’Onload del BODY
//
function load()
{
if (GBrowserIsCompatible())
{
// Crea mappa
map = new GMap2(document.getElementById(”map”));
// Creo GeoCoder
geocoder = new GClientGeocoder();

// VISUALIZZA L’INDIRIZZO DI PARTENZA
showAddress(”Roma”);

// Visualizza controlli - TIPO MAPPA
map.addControl(new GMapTypeControl());

// Visualizza controlli - ZOOM GRANDE
map.addControl(new GLargeMapControl());
}
}
//]]>

Indirizzo:

Posizionare struttura nella mappa!

Nella root del sito poi ho ewalizzato il file ajaxsave.php con il seguente codice:
Giovanni scrive:
25 Marzo 2009 alle 08:54
Nell’ajaxsave.php è sufficiente togliere ArrL()
Così:

$longitudine = $_REQUEST['long'];
$latitudine = $_REQUEST['lat'];
miki scrive:
22 Aprile 2009 alle 00:30
Salve a tutti, e complimenti in particolare all\’ autore di questo tutorial, vorrei avere gentilmente se possibile delle informazioni su come creare la pagina che mostrerà il risultato finale…. purtroppo sono alle primissime armi e non so come iniziare…. vorrei capire quante pagine devo creare e come nominarle. Sarei molto lieto a chi mi rispondesse grazie in anticipo
Dolomitico scrive:
19 Maggio 2009 alle 23:31
Complimenti per il tutorial migliore della rete.
Se volessi tenere la funzione arrL (che non mi funziona) dove posso trovarla?

Giovanni scrive:
21 Maggio 2009 alle 06:24

E’ una semplice funzione che taglia via un po’ di decimali:

// ARROTONDA COORDINATE SAT.
function  arrL($val)
{
list($i, $d) = explode(".", $val);
return($i . "." . substr($d, 0, 8));
}

Gabriele scrive:
11 Gennaio 2010 alle 01:49
Intanto complimenti per l\\\’ottimo tutorial, grazie a cui c\\\’è stato possibile implementarlo sul nostro sito web.

Giovanni, secondo te perchè navigando il nostro sito a questo link:
http://www.societaelettricaitaliana.it/generatore_minieolico_Libellula_50kW.htm
in explorer ci funziona tutto bene ma su Firefox non appare il segnaposto?
Giovanni scrive:
11 Gennaio 2010 alle 06:47
Ho guardato il sorgente pagina e mi sembra che il form del preventivo venga chiuso ben dopo il div della mappa. Questo potrebbe essere un problema, tra l’altro firefox da un errore (basta fare “strumenti” “console degli errori”) proprio riguardo modulo.
Ti conviene chiudere il form di richiesta informazioni subito dopo il tasto di submit. Poi aprire un modulo (e richiuderlo subito dopo) con un altro nome relativo alla ricerca sulla mappa.

Senamion

Chi siamo:

Categorie:

Cerca:

Archivi:

I più letti

Un segnalino su google Maps spostabile con aggiormento AJAX delle coordinate satellitari

47 Commenti a “Un segnalino su google Maps spostabile con aggiormento AJAX delle coordinate satellitari”

Scrivi un commento