El otro día en el trabajo surgió la posibilidad de necesitar geolocalizar al usuario de una web y me puse a investigar.
de Javascript, que es capaz de averiguar, de forma transparente, dónde se encuentra el navegador, en función de redes wifi, IP de salida a internet y una serie de cosas que lo hacen mágico, porque la precisión asusta.
Esta funcionalidad viene de serie en Chrome y en Firefox > 3.6, aunque proporcionan información ligeramente distinta:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" >
//Address is printed in a friendly way
function updateContent(address){
p2 = document.getElementById("p2");
p2.innerHTML = "<p>You are at "+address.street+", "+
address.streetNumber+", "+address.city+", "+
address.region+", "+address.country+"</p>";
}
//This function invokes google maps api for getting address for given position
//and returns an object similar to the one returned by firefox
function codeLatLng(lat, lng) {
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(lat, lng);
geocoder.geocode({'latLng': latlng}, function(results, status) {
address = {
street: "",
streetNumber: "",
city: "",
region: "",
country: ""
};
if (status == google.maps.GeocoderStatus.OK) {
if (results[0]) {
address = {
street: results[0].address_components[1].long_name,
streetNumber: results[0].address_components[0].long_name,
city: results[0].address_components[2].long_name,
region: results[0].address_components[3].long_name,
country: results[0].address_components[5].long_name
};
}
}
updateContent(address);
});
}
//print position
function displayPosition(position) {
p1 = document.getElementById("p1");
p1.innerHTML = "<table border='1'><tr><th>Timestamp</th><td>"+ position.timestamp +
"<tr><th>Latitude (WGS84)</th><td>" + position.coords.latitude + " deg</td></tr>" +
"<tr><th>Longitude (WGS84)</th><td>" + position.coords.longitude + " deg</td></tr></table>";
//alert("Position: "+position.coords.latitude+", "+position.coords.longitude);
var address = null;
if(!position.address){
//No address is available, so call to Google Maps API has to be made
codeLatLng(position.coords.latitude, position.coords.longitude);
}else{
updateContent(position.address);
}
}
function displayError(positionError) {
alert("Unable to get Position :(")
}
//main code
try {
if(typeof(navigator.geolocation) == 'undefined'){
gl = google.gears.factory.create('beta.geolocation');
} else {
gl = navigator.geolocation;
}
}catch(e){}
if (gl) {
gl.getCurrentPosition(displayPosition, displayError);
} else {
alert("I'm sorry, but geolocation services are not supported by your browser.");
}
</script>
</head>
<body>
<div id="p1"></div>
<div id="p2"></div>
</body>
</html>