Geolocalización con JavaScript GoogleMaps

geolocalizacion

En este artículo veremos como podemos realizar Geolocalización con JavaScript y Google Maps, este tipo de funciones en la actualidad se han convertido en unos de los principales plus en muchos proyectos de Software Web y Mobiles, en conjunto con las aplicaciones en tiempo real que hacen uso de la Geolocalización, servicios como Google Maps, Waze, Redes Sociales, son solo algunos ejemplos de las multiples plataformas que actualmente están realizando Geolocalizaciones con el fin de brindar mayor experiencia al usuario al momento de interactuar con las aplicaciones, veamos un ejemplo de como podemos Geolocalizar con JavaScript.

¿Que es la Geolocalización?

La Geolocalización consiste en poder hallar o ubicar un objeto, persona, lugar o cosa geográficamente, lo cual normalmente podemos representarlo en un mapa.

¿Como se realiza la Geolocalización?

La Geolocalización se realiza por medio de coordenadas que son obtenidas de satélites o torres de telefonía.

¿Para que puede servirme la Geolocalizar?

Entre los muchos usos que se le pueden dar a la Geolocalización podemos encontrar:

  • Saber tu ubicación en un lugar que no conozcas.
  • Ubicar Lugares, Objetos, Personas, etc.
  • Solicitar Servicios a una dirección o ubicación.
  • Enviar tu posición geográfica a otra persona.
  • Saber las rutas a tomar para llegar a una dirección.

Geolocalización con JavaScript:

A continuación veamos un ejemplo en código con el cual podremos obtener nuestra Longitud y Latitud para determinar nuestra posición en el mapa:

<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
 <title>Geo Localización Con JavaScript</title>
<script type="text/javascript">
function loadLocation () {
 navigator.geolocation.getCurrentPosition(viewMap,ViewError,{timeout:1000});
}
function viewMap (position) {
 var lon = position.coords.longitude;
 var lat = position.coords.latitude;
 var link = "https://www.google.com/maps/place/8°57'00.3N+75°2652.2W/@"+lat+","+lon+",19z"
 document.getElementById("long").innerHTML = "Longitud: "+lon;
 document.getElementById("latitud").innerHTML = "Latitud: "+lat;
 document.getElementById("link").href = link;
}
function ViewError (error) {
 alert(error.code);
} 
 </script>
</head>
<body onload="loadLocation();">
<label id="long"></label> <br/>
<label id="latitud"></label> <br/>
<a id="link" target="_blank">Ver en el Mapa</a>
</body>
</html>

Cabe resaltar que el navegador nos preguntará si deseamos permitir mostrar nuestra ubicación.

¡Suscríbete a mi canal, para acceder a más contenidos gratuitos!

Un comentario

  1. joselaurens Contestar

    He copiado el código, pero me devuelve un error “1” en el alert, desde mi BQ M5

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *