buenas... soy algo nuevo en esto de google maps... estoy teniendo un problema el cual quizas alguien me pueda dar una mano... de principio tengo un mapa en google maps que me va pidiendo ciudades, y al ir agregandolas se va formando la ruta con marcadores, hasta ahi todo perfecto, mi problema esta que esta ruta cuando actualizo el navegador desaparece... alguien tiene alguna idea de como puedo hacer para que esta no desaparezca al actualizar el navegador? saludos dejo mi codigo por las dudas q alguien se apiade de mi alma....
Código PHP:
Ver original<html>
<head>
<meta charset="utf-8" />
<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<title>Test Google Maps</title>
</head>
<body>
<!-- MAPA -->
<div id="map_canvas" style="width: 600px; height: 600px;"></div>
<input type="text" name="ciudad" id="ciudad" /> <button onclick="agregarCiudad();">Agregar</button>
<!-- funcion para agregar ciudad. La separo porque es sólo ejemplo -->
<script type="text/javascript">
function agregarCiudad(){
showAddress(document.getElementById('ciudad').value);
document.getElementById('ciudad').value = '';
}
</script>
<script type="text/javascript">
//variables y objetos globales
var map //mapa
var geocoder; //geocoder
var _path = []; // ruta
var _poliLinea = new google.maps.Polyline({ //polilinea
path: _path,
strokeColor: '#FF0000',
strokeOpacity: 1.0,
strokeWeight: 2
});
//inicializo
initialize();
function initialize() {
//centrado
var myLatLng = new google.maps.LatLng(37.4419, -122.1419);
//opciones
var mapOptions = {
zoom: 1,
center: myLatLng,
mapTypeId: google.maps.MapTypeId.TERRAIN
};
//geocoder
geocoder = new google.maps.Geocoder();
//creo mapa
map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
//asigno polilinea al mapa
_poliLinea.setMap(map);
}
function showAddress(s_address) {
var address = s_address;
//busco la direccion dada
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
//centro el mapa en el resultado
map.setCenter(results[0].geometry.location);
//creo marcador
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
//agrego punto a la linea
agregarRuta(results[0].geometry.location)
} else {
alert('Error: ' + status);
}
});
}
function agregarRuta(o_punto){
//creo punto a partir de la dirección dada
var o_LL = new google.maps.LatLng(o_punto.Xa, o_punto.Ya)
//agrego el punto al array de la ruta
_path.push(o_LL);
//cargo la nueva ruta en la polilinea
_poliLinea.setPath(_path);
//centro el mapa en el último punto
map.setCenter(o_LL);
//Hago un poco de zoom
map.setZoom(6);
}
</script>
</body>
</html>