Obtener la ubicación del GPS desde el navegador web

Estoy desarrollando un sitio web basado en dispositivos móviles, allí he integrado Google Maps, necesito llenar el campo 'De' de Google Maps dinámicamente.

¿Es posible obtener la ubicación GPS del navegador web y completarla en el campo 'De' de un mapa de Google de forma dinámica?

Si usa la API de geolocalización , sería tan simple como usar el siguiente código.

navigator.geolocation.getCurrentPosition(function(location) {
  console.log(location.coords.latitude);
  console.log(location.coords.longitude);
  console.log(location.coords.accuracy);
});

También puede utilizar la API de ubicación del cliente de Google .

Este problema se ha discutido en ¿Es posible detectar la ubicación GPS de un navegador móvil? y Obtener datos de posición del navegador móvil . Puedes encontrar más información allí.

Para dar una respuesta un poco más específica. HTML5 le permite obtener las coordenadas geográficas, y hace un trabajo bastante decente. En general, el soporte del navegador para la geolocalización es bastante bueno, todos los principales navegadores excepto ie7 y ie8 (y opera mini). IE9 hace el trabajo pero tiene el peor desempeño. Pagar caniuse.com:

http://caniuse.com/#search=geol

También necesita la aprobación de su usuario para acceder a su ubicación, así que asegúrese de verificar esto y dar algunas instrucciones decentes en caso de que esté apagado. Especialmente para Iphone activar permisos para Safari es un poco engorroso.

Use esto, y encontrará toda la información en http://www.w3schools.com/html/html5_geolocation.asp

<script>
var x = document.getElementById("demo");
function getLocation() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(showPosition);
    } else {
        x.innerHTML = "Geolocation is not supported by this browser.";
    }
}
function showPosition(position) {
    x.innerHTML = "Latitude: " + position.coords.latitude + 
    "<br>Longitude: " + position.coords.longitude; 
}
</script>

Ahí está el API GeoLocation , pero la compatibilidad del navegador es bastante escasa en la actualidad. La mayoría de los sitios que se preocupan por tales cosas usan una base de datos GeoIP (con las condiciones habituales sobre la inexactitud de dicho sistema). También puede consultar los servicios de terceros que requieren la cooperación del usuario, como FireEagle .

Observable

/*
  function geo_success(position) {
    do_something(position.coords.latitude, position.coords.longitude);
  }

  function geo_error() {
    alert("Sorry, no position available.");
  }

  var geo_options = {
    enableHighAccuracy: true,
    maximumAge        : 30000,
    timeout           : 27000
  };

  var wpid = navigator.geolocation.watchPosition(geo_success, geo_error, geo_options);
  */
  getLocation(): Observable<Position> {
    return Observable.create((observer) => {
      const watchID = navigator.geolocation.watchPosition((position: Position) => {
        observer.next(position);
      });
      return () => {
        navigator.geolocation.clearWatch(watchID);
      };
    });
  }

  ngOnDestroy() {
    this.sub.unsubscribe();
  }

Usemos las últimas funciones de flecha gorda :

navigator.geolocation.getCurrentPosition((loc) => {
  console.log('The location in lat lon format is: [', loc.coords.latitude, ',', loc.coords.longitude, ']');
})