elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Security Series.XSS. [Cross Site Scripting]


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  Google Maps API v3 Markes e InfoWindows
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: Google Maps API v3 Markes e InfoWindows  (Leído 7,832 veces)
[u]nsigned


Desconectado Desconectado

Mensajes: 2.397

JS/Node developer


Ver Perfil WWW
Google Maps API v3 Markes e InfoWindows
« en: 17 Enero 2012, 21:40 pm »

Hola, estoy implementando Google Maps API v3 en mi sitio. En un pagina cargo un archivo JSON (generado dinamicamente con PHP) que tiene la siguiente estructura:

Código:
{
cantidad: 2,
lugares: {
1: {
id_lugar: "1",
nombre_lugar: "Municipalidad de Rawson",
latitude: "-43.2999997",
longitude: "-65.1052474",
icono: "gov"
},
2: {
id_lugar: "4",
nombre_lugar: "Honorable Legislatura de la Provincia del Chubut",
latitude: "-43.297535",
longitude: "-65.10604269999999",
icono: "gov"
}
}
}

El codigo JS (jQuery) es este:

Código
  1. $.getJSON( 'ajax.php?action=list&categoria=gov', function(json){
  2.  
  3. for(var i=1; i<=json.cantidad; i++)
  4. {
  5. var marker = new google.maps.Marker({
  6. position:new google.maps.LatLng(json['lugares'][i]['latitude'], json['lugares'][i]['longitude']),
  7. map:map,
  8. title:json['lugares'][i]['nombre_lugar']
  9. });
  10.  
  11. var infowindow = new google.maps.InfoWindow({
  12. content:json['lugares'][i]['nombre_lugar']
  13. });
  14.  
  15. Marcadores[i] = marker;
  16. Informacion[i] = infowindow;
  17.  
  18. google.maps.event.addListener(Marcadores[i] , "click", function(){//#
  19. Informacion[i].open(map,Marcadores[i] );
  20. });//#
  21. }
  22.  
  23. } );

Pero no me funciona, al parecer no me genera el listener del evento click sobre cada uno de los marcadores para abrir el correspondiente InfoWindow. El caso es que si comento las lineas indicadas con //#, para que los IW se abran automaticamente sin darle click al marcador si funciona, pero lo que yo quiero es que esten ocultos y mostrarlos cuando se hace click.

Alguna sugerencia?  :huh:

PD: Tanto el array Marcadores como Informacion estan incializados como arrays vacios globales al principio del script


« Última modificación: 17 Enero 2012, 21:44 pm por El As del Club Paris » En línea

No hay atajo ante la duda, el misterio se hace aquí...
Se hace carne en cada uno, el misterio es existir!
Shell Root
Moderador Global
***
Desconectado Desconectado

Mensajes: 3.724


<3


Ver Perfil WWW
Re: Google Maps API v3 Markes e InfoWindows
« Respuesta #1 en: 18 Enero 2012, 06:14 am »

Wii alguien interesando en el API de GoogleMaps :D, intentad con lo siguiente,

Código
  1.    var structMap = {
  2.        cantidad: 2,
  3.        lugares: {
  4.            1: {
  5.                id_lugar: "1",
  6.                nombre_lugar: "Acuaparque Ditaires",
  7.                latitude: "6.169312989325159",
  8.                longitude: "-75.63074111938477",
  9.                icono: "gov"
  10.            },
  11.            2: {
  12.                id_lugar: "4",
  13.                nombre_lugar: "Triana",
  14.                latitude: "6.169312989325159",
  15.                longitude: "-75.64567565917969",
  16.                icono: "gov"
  17.            }
  18.        }
  19.    }
  20.  
  21.    function initMap() {
  22.        // Posición inicial
  23.        var latlng = new google.maps.LatLng( structMap['lugares'][1]['latitude'], structMap['lugares'][1]['longitude'] );
  24.  
  25.        // Opciones del mapa
  26.        var myOptions = {
  27.            zoom          : 15,
  28.            center       :  latlng,
  29.            mapTypeId : google.maps.MapTypeId.ROADMAP
  30.        };
  31.  
  32.        // Mapa
  33.        var map = new google.maps.Map( document.getElementById("map_canvas"), myOptions );
  34.  
  35.        for(var i=1; i<=structMap.cantidad; i++){
  36.            // Agregar marcador
  37.            var marker = new google.maps.Marker({
  38.                position : new google.maps.LatLng( structMap['lugares'][i]['latitude'], structMap['lugares'][i]['longitude'] ),
  39.                map       : map,
  40.                title        : structMap['lugares'][i]['nombre_lugar']
  41.            });
  42.  
  43.            // Agregar ventana de información con evento
  44.            mostrarMensaje( marker, structMap['lugares'][i]['nombre_lugar'] );
  45.        }
  46.  
  47.        function mostrarMensaje(marker, msg) {
  48.            // Crear ventana de información.
  49.            var infowindow = new google.maps.InfoWindow({
  50.                content : msg
  51.            });
  52.  
  53.            // Crear evento para mostrar la ventana al dar click
  54.            google.maps.event.addListener(marker, 'click', function(){
  55.                infowindow.open(map, marker);
  56.            });
  57.        }
  58.  }

Resultado,


« Última modificación: 18 Enero 2012, 06:33 am por Shell Root » En línea

Te vendería mi talento por poder dormir tranquilo.
[u]nsigned


Desconectado Desconectado

Mensajes: 2.397

JS/Node developer


Ver Perfil WWW
Re: Google Maps API v3 Markes e InfoWindows
« Respuesta #2 en: 27 Enero 2012, 12:58 pm »

Muchisimas gracias, funciona a la perfeccion!
En línea

No hay atajo ante la duda, el misterio se hace aquí...
Se hace carne en cada uno, el misterio es existir!
Sandala

Desconectado Desconectado

Mensajes: 2


Ver Perfil
Re: Google Maps API v3 Markes e InfoWindows
« Respuesta #3 en: 7 Abril 2016, 22:08 pm »

Hola, Hola..

 :rolleyes: Hay alguien que pueda ayudarme por favor ?
En línea

Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
Google Maps en 3D
Noticias
wolfbcn 0 2,286 Último mensaje 27 Abril 2010, 21:28 pm
por wolfbcn
Tutorial API Google Maps con VB. NET y C# « 1 2 »
.NET (C#, VB.NET, ASP)
seba123neo 11 34,043 Último mensaje 30 Noviembre 2011, 21:31 pm
por corneliusjesus
Google cierra el grifo gratuito al acceso intensivo a la API de Google Maps
Noticias
wolfbcn 2 3,884 Último mensaje 28 Octubre 2011, 13:53 pm
por [u]nsigned
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines