Código Javascript:
Pero tengo un select que me muestra un mapa según cada opción, pero es el mismo mapa, el código es este:Ver original
function localizame() { if (navigator.geolocation) { /* Si el navegador tiene geolocalizacion */ navigator.geolocation.getCurrentPosition(coordenadas, errores); }else{ alert('Oops! Tu navegador no soporta geolocalización. Bájate Chrome, que es gratis!'); } } function coordenadas(position) { latitud = position.coords.latitude; /*Guardamos nuestra latitud*/ longitud = position.coords.longitude; /*Guardamos nuestra longitud*/ } function getCoords(marker){ document.getElementById("latitud").value=''+marker.getPosition().lat(); document.getElementById("longitud").value=''+marker.getPosition().lng(); } function initialize() { var myLatlng = new google.maps.LatLng(9.314299432752295,-70.60566794257812); var myOptions = { zoom: 17, center: myLatlng, mapTypeId: google.maps.MapTypeId.ROADMAP, } var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); marker = new google.maps.Marker({ position: myLatlng, draggable: true, title:"Descubrelo" }); google.maps.event.addListener(marker, "dragend", function() { getCoords(marker); }); marker.setMap(map); getCoords(marker); }
Código Javascript:
El primer mapa lo tengo de la siguiente manera en el primer div:Ver original
$(document).ready(function(){ $(".contenido").hide(); $("#planes").change(function(){ $(".contenido").hide(); $("#div_" + $(this).val()).toggle("slow", function(){ google.maps.event.trigger(initialize(), 'resize'); }); }); });
Código HTML:
y me lo muestra perfecto acá, pero en el segundo y tercer div lo tengo de la misma manera y me sale en blanco, es decir no carga, intenté cambiando en el html esto <div id="map_canvas2"> y en el js lo puse así para probar, pero sigue igual:Ver original
Código Javascript:
Ver original
function localizame2() { if (navigator.geolocation) { /* Si el navegador tiene geolocalizacion */ navigator.geolocation.getCurrentPosition(coordenadas2, errores); }else{ alert('Oops! Tu navegador no soporta geolocalización. Bájate Chrome, que es gratis!'); } } function coordenadas2(position) { latitud = position.coords.latitude; /*Guardamos nuestra latitud*/ longitud = position.coords.longitude; /*Guardamos nuestra longitud*/ } function getCoords2(marker){ document.getElementById("latitud").value=''+marker.getPosition().lat(); document.getElementById("longitud").value=''+marker.getPosition().lng(); } function initialize2() { var myLatlng = new google.maps.LatLng(9.314299432752295,-70.60566794257812); var myOptions = { zoom: 17, center: myLatlng, mapTypeId: google.maps.MapTypeId.ROADMAP, } var map = new google.maps.Map(document.getElementById("map_canvas2"), myOptions); marker = new google.maps.Marker({ position: myLatlng, draggable: true, title:"Descubrelo" }); google.maps.event.addListener(marker, "dragend", function() { getCoords2(marker); }); marker.setMap(map); getCoords2(marker); }
Que puedo hacer para solucionarlo? los div 2 y 3 me lo muestran blanco usándolo de esa y la otra manera, Gracias.