duda con google maps api v3

byzard · #1 (**permalink**) 28/10/2010, 09:23

Estimados,

tengo el siguiente codigo, completo para copipaster en un html
[CODE]
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps JavaScript API v3 Example: Info Window Simple</title>
<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function initialize() {
var myLatlng = new google.maps.LatLng(-18.45963, -70.28132);
var myOptions = {
zoom: 16,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}

var map = new google.maps.Map(document.getElementById("map_canva s"), myOptions);

var des1 = '<div id="content">'+
'<div id="siteNotice">'+
'</div>'+
'<h1 id="firstHeading" class="firstHeading">Uluru</h1>'+
'<div id="bodyContent">'+
'Uluru, also referred to as Ayers Rock, is a large ' +
'rock caves and ancient paintings. Uluru is listed as a World '+
'Heritage Site.'+
'Attribution: Uluru, aaa aaa aaa aaa aaa aaaaaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa a aa aaa aaa aaa aaa aaa aaa aa a aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaaaaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa <a href="http://en.wikipedia.org/w/index.php?title=Uluru&oldid=297882194">'+
'http://en.wikipedia.org/w/index.php?title=Uluru</a> '+
'(last visited June 22, 2009).'+
'</div>'+
'</div>';

var infowindow = new google.maps.InfoWindow({
content: des1
});

var p1 = new google.maps.LatLng(-18.455066,-70.292072);
var p2 = new google.maps.LatLng(-18.45964, -70.28143);
var p3 = new google.maps.LatLng(-18.45965,-70.28159);

var marker = new google.maps.Marker({
position: p1, map: map, title: 'aaaa'
});
var marker = new google.maps.Marker({
position: p2, map: map, title: 'bbbb'
});
var marker = new google.maps.Marker({
position: p3, map: map, title: 'ccccc'
});

google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
}

</script>
</head>
<body onload="initialize()">
<div id="map_canvas"></div>
</body>

</html>
[CODE]

como se ve hay 3 puntos, pero lo que yo no se como se hace, es colocar la funcion o el codigo para que la info de los marcadores cambie segun corresponda.

alguien mas experto en el tema me puede decir?

gracias.

PD: no supe en que parte dejar este post, ya que el resto de las categorias no me parecio tan adecuado a esto.

AnibalDiaz · #2 (**permalink**) 12/07/2011, 01:01

En la pagina de los ejemplos de google maps api v3, te viene explicado como añadir eventos a los mapas, en este caso, tendrías que añadir el evento "click". Así mismo, en cada "click" cargar el infowindows

//añado evento click al mapa.
google.maps.event.addListener(marker, 'click', function () {
infowindow.open(map, marker);
});

mas ejemplos:
http://code.google.com/intl/es/apis/...les/index.html

Saludos,