Geolocalización JS y PHP

[pdominguez0608]

muy buenas,

tengo un problema, estoy desarrollando una web en PHP, donde se genera un código QR y este se puede leer con un smartphone, quería, en este momento, que al leer el código se enviara un email con la posición desde donde se esta leyendo el código en un mapa de Google.
ahora empieza mi problema y donde querría que me hachareis una mano.
todo lo que encuentro sobre geolocalización esta hecho con JS con lo que pasar los valores de latitud y longitud a PHP me resulta un problema, desconozco AJAX que es, según creo, como debería hacerlo.
¿hay alguna otra forma de hacerlo? he visto que PHP tiene una función de localización en base a la IP
¿es fiable este posicionamiento? ¿tiene una exactitud aceptable?
¿hay alguna otra forma de hacerlo?
si no es viable ¿como debería hacerlo en AJAX?

agradezco vuestro interés y ayuda

[djaevi]

Hola buenas tardes, en efecto lo más fiable para que la geolocalización sea precisa es utilizar las herramientas que vienen con html5 para detectar latitud y longitud a traves del GPS del smartphone y luego enviarlas. Sino queres usar AJAX una cosa que se me ocurre es que tengas preestablecido un formulario con dos inputs en donde una vez que tengas capturadas las coordenadas se las pases, y una vez pasadas hagas el submit del formulario.

Por ejemplo supongamos que las variables latitud y longitud ya han capturado las coordenadas actual a traves del codigo qr:

latitud = -29359023.339259
longitud = -130493.93293

Y tenes un html con lo siguiente:

<form id="geoloc" method="post" action="miPagina.php">
<input type="text" id="latitud">
<input type="text" id="longitud">
</form>

Entonces con javascript una vez que capturas las coordenadas haces lo siguiente:

document.getElementById("latitud").value = latitud;
document.getElementById("longitud").value = longitud;

Una vez pasadas las coordenadas a los elementos del formulario, si queres lo envias usando:

document.getElementById("geoloc").submit();

Ojala te sirva, cualquier duda te sigo dando una mano. Saludos!

[pdominguez0608]

Gracias Djaevi,
me pondré con ello, a ver como se me da.... soy nuevo en estos temas y no se como voy a salir...,

te digo algo según vaya adelante...
Un saludo

[pdominguez0608]

Hola Dejaevi,
lo siento, pero no soy capaz de llevarme los valores de coordenadas a PHP,
este es el codigo que tengo, la idea es sacar el mapa y la posicion en un email de PHP.

Código:

<style>
* { margin: 0; padding: 0; }
html { height: 100%; }
body {font-size: 16px;font-family:'Open Sans', sans-serif;height: 100%;position: relative;margin-left: 5px;}
cabecera { background-color: rgba(0,16,27,.85); height: 40px; width: 30%;padding-left: 10px;padding-top: 10px; position: absolute; z-index: 200; box-shadow: 0px 2px 3px #333333;}
cabecera > h1, a, a:visited {display: inline;color: #FFFFFF;font-family: 'Open Sans', sans-serif;font-size: 1.3em;font-weight: bold;/*float: right;*/margin-top: 10px;margin-right: 10px;text-decoration: none;}
#mapa {background: transparent;height: 400px;width: 29%;top: 60px;left: 0;right: 0;bottom: 0;margin-left: 13px;}
#informacion {position: absolute;background: rgba(0,16,27,.85);z-index: 200;top: 48%;width: 30%;padding-bottom: 10px;padding-left: 10px;padding-top: 10px;
}
#informacion h2,#informacion h3 { color: #FFFFFF; text-shadow: 1px 1px 1px #000000; font-weight: normal; font-size: .9em; }
#informacion h2 { font-size: 1.1em; margin-bottom: 10px; }
#informacion h3 span { color: #FF5555; }
</style>
<meta charset="UTF-8">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300' rel='stylesheet' type='text/css' />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type='text/javascript' src='https://maps.googleapis.com/maps/api/js?sensor=true'></script>
<script language='JavaScript' type='text/javascript'>
	function informacion (coordenadas) {
		$('#latitude').html(coordenadas.Lat);
		$('#longitude').html(coordenadas.Lng)
	}
	function initialize() {
		var coordenadas = {
			Lat: 0,
			Lng: 0
		};
		
		function localizacion (posicion) {
			coordenadas = {
				Lat: posicion.coords.latitude,
				Lng: posicion.coords.longitude
			}
			informacion(coordenadas);
			var mapOptions = {
				zoom: 17,
				center: new google.maps.LatLng(coordenadas.Lat, coordenadas.Lng),
				disableDefaultUI: true,
				mapTypeId: google.maps.MapTypeId.ROADMAP
			}
			var map = new google.maps.Map(document.getElementById('mapa'), mapOptions);
			var infowindow = new google.maps.InfoWindow({
				map: map,
				position: new google.maps.LatLng(coordenadas.Lat, coordenadas.Lng),
				content: 'Ubicación de emergencia'
            });
		}
		function errores (error) {
			alert('Ha ocurrido un error al obtener la información');
		}
		if (navigator.geolocation) {
			navigator.geolocation.getCurrentPosition(localizacion,errores);
		} else {
			alert('Tu navegador no soporta la Geolocalización');
		}
	}
</script>
<body onload='initialize()'>
<cabecera>
		<h1>Localización </h1><a href='http://qraid.tk' target='new'>QR[Aid]</a>
	</cabecera>
<section id='informacion'>
		<h2>Posición actual:</h2>
		<h3>Latitud: <span id='latitude'></span></h3>
		<h3>Longitud:<span id='longitude'></span></h3>
	</section>
	<section id='mapa'></section>
</body>

Gracias por tu colaboración