Peleándome una vez más con la api de google me pasa un par de cosas que no se muy bien por qué puede ser:
Mi mapa lo genero dinámicamente porque tengo que recoger los datos de latitud y longitud de la base de datos. Bien, eso lo he logrado pero al mostrar el contenedor (lo tengo oculto hasta que le den a un botón y entonces se me mostraría el mapa) y pulsar sobre un marcador, el mapa se me desplaza como si estuviese el marcador en otra zona puesto.
Os pongo unas imágenes...
Esta corresponde a cuando carga el bloque
Esto cuando pulso sobre el marcador (si veis en la zona izquierda es donde está el marcador...es pulsar y automáticamente se me desplaza hasta ahí)
Esto son los problemas principales...pero a parte (supongo que entra más en tema de CSS, si hace falta abrir un nuevo post me lo comentáis y lo pongo )
No se por qué me ocurre esto justo cuando intento ver el contenido de la ficha info del marcador
Os pongo la parte de javascript en la que genero el mapa....no le veo nada raro en lo que es la construcción pero si se me escapa algo...
Lo único "extraño" es que tengo que hacer un parseFloat para que no me casque ahí el mapa...por lo demás no le veo nada raro.
Código Javascript:
Ver original
var parametros = JSON.parse(data); var divContainer = document.getElementById('mapa-inicial'); var bounds = new google.maps.LatLngBounds(); if (parametros.length!==0){ var tamanioArray = (parametros.length-1); var ultimoRest = parametros[tamanioArray]; }else{ var ultimoRest = parametros[0]; } var latCenter = parseFloat(ultimoRest["lat"]); var lonCenter = parseFloat(ultimoRest["lon"]); var opciones = {}; opciones={ zoom:16, mapTypeId:google.maps.MapTypeId.SATELLITE, center:new google.maps.LatLng(latCenter,lonCenter), scrollwheel:true, scaleControl:true, draggable:true }; var mapa = new google.maps.Map(divContainer,opciones); var i; for (i=0;i<parametros.length;i++){ var marker=""; var contenido=""; contenido="Cada parametro ejemplo"; var infoWindow=new google.maps.InfoWindow({content: contenido}); marker = new google.maps.Marker({ position: new google.maps.LatLng(parseFloat(parametros[i]["lat"]),parseFloat(parametros[i]["lon"])), map:mapa }); google.maps.event.addListener(marker,'click',function(){ infoWindow.open(mapa, marker); }); }
Gracias por la ayuda de antemano!!!