Buenos dias, mi consulta es la siguiente estoy haciendo un programa en
web con php y javascript que lo que hace es enseñar la posicion de donde
esta el usuario y que segun el mapa que enseñe guarde la posicion de
latitud y longitud y demas datos para pasarselos a php para guardalos en
base de datos, y que despues que el usuario quiera vea su posicion mas
tarde en que se encontraba, obvio que para esto llamaria a los datos
guardados.
mi consula es que al pasar los datos de javascript a php del mapa, y al
mostrarlos como prueba me dice que no estan definidos, necesito ayuda
por favor que es lo que me falta, porque no me las define, ni
convierte, mi codigo es este
--
-------------
!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Pruebas</title>
<!--<link rel="stylesheet"
href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css"/>-->
<link rel="stylesheet" href="CSS/INDEX.CSS/jquery.mobile-1.4.5.min.css"
/>
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script
src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<link type="text/css" rel="stylesheet" href="CSS/INDEX.CSS/index.css">
<link type="text/css" rel="stylesheet" href="CSS/INDEX.CSS/mapa.css">
<script src="formulario/formulario.jsp" type="text/javascript"></script>
<script src="js/mapa.js" type="text/javascript"></script>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<!--inicio-->
<!--fin-->
</head>
<body>
<!--pagina-->
<div data-role="page" id="marcas" data-theme="c">
<!--header-->
<div data-role="header" data-theme="e">
<br/>
<h1></h1>
<a href="#" data-role="button" data-inline="true"
class="boton">matclad.net</a>
<a href="#" data-role="button" data-inline="true"
class="boton">Contactar</a>
</div>
<!--Content-->
<div data-role="content" data-theme="c">
<div class="container">
<div class="div-img hidden" >
<img class="img" src="imagenes/MatClad.png"
title="Foto6" alt="Foto6">
<div class="overlay"></div>
</div>
</div>
<p>Entrada / Salida<br/>Para ver de que lugar marca, por
favor cargue el mapa</p>
<!-- <div data-role="content">-->
<!--</div>-->
<!-- Se determina y escribe la localizacion -->
<div id='ubicacion'></div>
<script type="text/javascript">
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(mostrarUb icacion);
} else {alert("¡Error! Este navegador no soporta la
Geolocalización.");}
function mostrarUbicacion(position) {
var times = position.timestamp;
var latitud = position.coords.latitude;
var longitud = position.coords.longitude;
var altitud = position.coords.altitude;
var exactitud = position.coords.accuracy;
var div = document.getElementById("ubicacion");
<!---->var prueba=div.innerHTML = "Timestamp: " + times +
"<br>Latitud: " + latitud + "<br>Longitud: " + longitud +
"<br>Altura en metros: " + altitud + "<br>Exactitud: " +
exactitud;
//ACA ES DONDE INTENTO CONVERTIRLAS A PHP Y NO ME CONVIERTE EJEMPLO
QUIERO PASAR LA VARIABLE LATITUD Y CONVERTIRLA A PHP PERO AL HACERLO ME
DICE QUE ESTA INDEFINIDA, GRACIAS
}
function refrescarUbicacion() {
navigator.geolocation.watchPosition(mostrarUbicaci on);}
</script>
---------
<!-- Se escribe un mapa con la localizacion anterior-->
<div id="demo"></div>
<div id="mapholder"></div>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<button onclick="cargarmap()">Cargar mapa</button>
<script type="text/javascript">
var x=document.getElementById("demo");
function cargarmap(){
navigator.geolocation.getCurrentPosition(showPosit ion,showError);
function showPosition(position)
{
lat=position.coords.latitude;
lon=position.coords.longitude;
latlon=new google.maps.LatLng(lat, lon)
mapholder=document.getElementById('mapholder')
mapholder.style.height='250px';
mapholder.style.width='500px';
var myOptions={
center:latlon,zoom:10,
mapTypeId:google.maps.MapTypeId.ROADMAP,
mapTypeControl:false,
navigationControlOptions:{style:google.maps.Naviga tionControlStyle.SMALL}
};
var map=new
google.maps.Map(document.getElementById("mapholder "),myOptions);
var marker=new google.maps.Marker({position:latlon,map:map,title: "You
are here!"});
}
function showError(error)
{
switch(error.code)
{
case error.PERMISSION_DENIED:
x.innerHTML="Denegada la peticion de Geolocalización en el
navegador."
break;
case error.POSITION_UNAVAILABLE:
x.innerHTML="La información de la localización no esta
disponible."
break;
case error.TIMEOUT:
x.innerHTML="El tiempo de petición ha expirado."
break;
case error.UNKNOWN_ERROR:
x.innerHTML="Ha ocurrido un error desconocido."
break;
}
}}
</script>
<!--footer-->
<div data-role="footer" data-theme="b">
<h2>Pie de Página</h2>
</div>
</div>
<br/>
<!-- Se determina y escribe la localizacion -->
<!-- Se determina y escribe la localizacion -->
</body>
</html>
--------------
