Ver Mensaje Individual
  #5 (permalink)  
Antiguo 09/11/2010, 05:52
Avatar de nicojaure
nicojaure
 
Fecha de Ingreso: mayo-2004
Ubicación: Buenos Aires
Mensajes: 49
Antigüedad: 20 años, 6 meses
Puntos: 0
Respuesta: Google Maps: Abrir globos de información y peso de la página

Gracias Catpaw.
Pego el código aqui que se puede ver funcionando en http://vertigoextremo.com.ar/muros como decía en el primer post.

La función animate es la hace mueve el mapa hacia la marca.
quisiera generar una puntero a una marca determinada para poder desplegar el globo correspondiente.
Si tenés idea como hacerlo te lo agradezco mucho.

Saludos

Código Javascript:
Ver original
  1. // TODO: replace map key with actual Google Map Key.
  2. var mapKey = "ABQIAAAAmBmsIECNt9L46XIOodXuyhQa_YWkl-zUZ7onQMIAxh2IOKKnBBTIpF5tK8P0QQUARzBLNKfBBFLBPg";
  3. var mapData = {
  4.   "center":{"lat":-40.460670,"lng":-63.039062,"zoom":4},  "name":"Muros_de_escalda_de_argentina",
  5.   "balloons":[{"lat":-26.838039,"lng":-65.158128 ,"msg":"<div class='globo_mapa'><a href='http://vertigoextremo.com.ar/escalada/muros/10329/'>Pambala Climb<br/>Islas Malvinas 300, Yerba Buena, Tucumán</a></div>"},]
  6. };
  7.  
  8. // Load GMap API,
  9. var keyUrl = "http://maps.google.com/maps?file=api&v=2&key="+mapKey;
  10. document.write('<' + 'script src="' + keyUrl + '"' +' type="text/javascript"><' + '/script>');
  11.  
  12. var map;
  13.  
  14. // Creates a marker at the given point with the given number label
  15. function createMarker(lat, lng, msg) {
  16.   var point = new GLatLng(lat, lng);
  17.   var marker = new GMarker(point);
  18.   GEvent.addListener(marker, "click", function() {
  19.     marker.openInfoWindowHtml(msg);
  20.   });
  21.   return marker;
  22. }
  23.  
  24. // Creates a Google map...
  25. function createMap(mapName, center, balloons) {
  26.   if (GBrowserIsCompatible()) {
  27.     map = new GMap2(document.getElementById(mapName));
  28.     map.addControl(new GSmallMapControl());
  29.     map.setCenter(new GLatLng(center.lat, center.lng), center.zoom);
  30.    
  31.     for(var i=0; i < balloons.length; i++) {
  32.       var info = balloons[i];
  33.       map.addOverlay(createMarker(info.lat, info.lng, info.msg));
  34.     }
  35.   }
  36. }
  37.  
  38. // Create map using the map data
  39. window.onload = function() {
  40.   createMap(mapData.name, mapData.center, mapData.balloons);
  41. }
  42.  
  43. function animate(string) {
  44.     var i = string.indexOf(",");    
  45.     string1 = string.slice (i+1,string.length);
  46.     var h = string1.indexOf(",");    
  47.     var j = string1.lastIndexOf(",");
  48.     lat = string1.slice (0,h);
  49.     log = string1.slice (h+1,j);
  50.     var amplicacion = string1.slice (j+1,string1.length);
  51.     var zoom = parseInt(amplicacion);
  52.     //alert ('hola' + amplicacion + 'hola');
  53.     map.setCenter(new GLatLng(lat,log), zoom);
  54.     //map.panTo(new GLatLng(lat,log));
  55.     //map.setZoom(zoom);
  56.     //map.openInfoWindow(GLatLng(lat,log)) 
  57.     //map.GInfoWindow.show()
  58.     }
  59.  
  60. // FEOX: Undefined?  
  61. //window.onunload = GUnload();
  62. document.write('<'+'div id="' + mapData.name + '" style="width: 380px; height: 540px"><'+'/div>');
  63. delete mapData;
__________________
www.nicojaure.com.ar