Angular

Como obtener geolocalización (latitud y longitud) con angular

En esta oportunidad les traigo como obtener su ubicación (latitud y longitud ) en angular de manera sencilla. Esto es importante si estas trabajando con mapas y necesitas mostrar la ubicación de un cliente o un usuario.

Pues bien el código es súper simple y sencillo, nos basamos en una promesa para obtener las coordenadas de la siguiente manera:

creamos un servicio llamado location.service.ts

– Agregamos el siguiente código al servicio

1
2
3
4
5
6
7
8
9
10
getPosition(): Promise<any> {
       return new Promise((resolve, reject) => {
           navigator.geolocation.getCurrentPosition(resp => {
                   resolve({lng: resp.coords.longitude, lat: resp.coords.latitude});
               },
               err => {
                   reject(err);
             });
       });
   }

– Una vez agregado el código al servicio procedemos a crear una función dentro de nuestro componente:

1
2
3
4
5
6
getLocation() {
    this.locationService.getPosition().then(pos => {
        this.latitude = pos.lat;
        this.longitude = pos.lng;
    });
}

ya solo nos queda dentro del ngOnInit de nuestro componente llamar a esa funcion

1
2
3
4
5
ngOnInit(){
this.getLocation()
}

Al hacer clic sobre permitir acceso a ubicación obtendremos nuestra latitud y longitud

Puedes descargar el código fuente desde este enlace

Hasta la próxima!

Fuente:
https://jordicuevas.website

Similar Posts

Leave a Reply

Your email address will not be published. Required fields are marked *