[API Gmaps v3] aprire un fumetto su un punto cliccato

**carlo2002** · 24-11-2010, 02:00

Uso questo codice per visualizzare un alert contenente le coordinate di un punto cliccato

codice:

<html>

<head><title>Gmaps</title>

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>

<script type="text/javascript">

var inizializza = function() {
var coordinate_centro_mappa = new google.maps.LatLng(24,10);
var options = { zoom: 1, center: coordinate_centro_mappa, mapTypeId: google.maps.MapTypeId.HYBRID };
var mappa_pdi = new google.maps.Map(document.getElementById('mappa_pdi'), options);


google.maps.event.addListener(mappa_pdi, 'click', function(event) { alert('Coordinate: ' + event.latLng);}); 

} ;

window.onload = inizializza ;

</script>

</head>

<body>

<h1>Gmaps v3</h1>

<div id="mappa_pdi" style="width:500px;height:280px"></div>

</body>
</html>

come si potrebbe invece che in un alert visualizzare le coordinate in un fumetto, con codice html, che si apre cliccando un punto qualsiasi della mappa?

è una cifra che ci sto provando ma in javascript sono una schiappa

grazie

**buribus** · 24-11-2010, 13:48

guarda quì:

http://javascript.html.it/articoli/l...-aggiuntive/3/

**carlo2002** · 24-11-2010, 14:01

Grazie, ma lo avevo già visto, purtroppo tutti gli esempi sono sempre di fumetti che si aprono cliccando su dei markers invece a me serve che si apra su un qualsiasi punto cliccato sulla mappa, ci sto provando da una settimana ma non riesco.

**mosquito70** · 24-11-2010, 14:36

Prova a dare un'occhiata a questi due link, anche se non so se ti potranno servire per quello che devi fare, ma potrebbero darti qualche spunto

http://www.svennerberg.com/2008/12/b...n-google-maps/
http://www.svennerberg.com/2009/01/h...n-google-maps/
http://maps.forum.nu/
http://www.bdcc.co.uk/Gmaps/BdccGmapBits.htm

e quindi la documentazione ufficiale

http://code.google.com/intl/es-ES/ap...html#outputxml

**carlo2002** · 24-11-2010, 15:52

più leggo meno capisco, anche la documentazione ufficiale non mi aiuta, proviamo a ragionare sul codice:

con addlistener richiamo la funzione per aprie il fumetto

codice:

google.maps.event.addListener(mappa_pdi, 'click', function() { 

???

});

poi dovrei fare la funzione che apre il fumetto e qui mi perdo

tutti gli esempi che trovo sono sempre per aprirlo in presenza di un marker tipo:

codice:

infowindow.open(map,marker);

**carlo2002** · 25-11-2010, 23:36

Qualcosa sta venendo

codice:

<html><head><title>Gmaps v3</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">

var inizializza = function() {
var coordinate_centro_mappa = new google.maps.LatLng(24,10);
var options = { zoom: 2, center: coordinate_centro_mappa, mapTypeId: google.maps.MapTypeId.HYBRID };
var mappa_pdi = new google.maps.Map(document.getElementById('mappa_pdi'), options);


google.maps.event.addListener(mappa_pdi, 'click', function(event) { 

var testo = 'Coordinate del punto cliccato: 
Latitudine: ' + event.latLng.lat() + '
Longitudine: ' + event.latLng.lng() ;

var infowindow = new google.maps.InfoWindow({content: testo}); 
infowindow.setPosition(event.latLng);
infowindow.open(mappa_pdi);

}) ;

} ;

window.onload = inizializza ;

</script>
</head>
<body>
<h1>Gmaps v3</h1>
<div id="mappa_pdi" style="width:600px;height:400px"></div>
</body></html>

ora mi resta ancora un problema da risolvere:

Ogni volta che clicco compare un ennesimo fumetto assieme ai precedenti, invece vorrei che se clicco più di una volta dovrebbe rimanere visibile solo il fumetto relativo all'ultimo punto cliccato al posto di quello precedente.

in pratica come si può vedere qui fatto con le API v2 http://gmaps.4null.net/_coordinate_clic_mouse.php

**buribus** · 26-11-2010, 02:53

var infowindow;

google.maps.event.addListener(mappa_pdi, 'click', function(event) {

if (infowindow) { infowindow.close(); }

var testo = 'Coordinate del punto cliccato:
Latitudine: ' + event.latLng.lat() + '
Longitudine: ' + event.latLng.lng() ;

infowindow = new google.maps.InfoWindow({content: testo});
infowindow.setPosition(event.latLng);
infowindow.open(mappa_pdi);

}) ;

**carlo2002** · 26-11-2010, 09:57

Perfetto !!!

ecco il codice completo e funzionante

codice:

<html><head><title>Gmaps v3</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">

var inizializza = function() {
var coordinate_centro_mappa = new google.maps.LatLng(24,10);
var options = { zoom: 2, center: coordinate_centro_mappa, mapTypeId: google.maps.MapTypeId.HYBRID };
var mappa_pdi = new google.maps.Map(document.getElementById('mappa_pdi'), options);
var infowindow;


google.maps.event.addListener(mappa_pdi, 'click', function(event) { 

if (infowindow) { infowindow.close(); }

var testo = 'Coordinate del punto cliccato: 
Latitudine: ' + event.latLng.lat() + '
Longitudine: ' + event.latLng.lng() ;

infowindow = new google.maps.InfoWindow({content: testo}); 
infowindow.setPosition(event.latLng);
infowindow.open(mappa_pdi);

}) ;

} ;

window.onload = inizializza ;

</script>
</head>
<body>
<h1>Gmaps v3</h1>
<div id="mappa_pdi" style="width:700px;height:450px"></div>
</body></html>

Grazie mille

Discussione: [API Gmaps v3] aprire un fumetto su un punto cliccato

Strumenti discussione

Ricerca discussione

Visualizza

[API Gmaps v3] aprire un fumetto su un punto cliccato

Permessi di invio