Centrando el mapa y agregando un marcador en la ubicación actual del usuario usando Leaflet

Si queremos obtener la ubicacion del usuario que esta viendo nuestro mapa de leaflet podemos hacer algo asi:

 map.locate({setView: true, maxZoom: 16});

function onLocationFound(e) {
 var radius = e.accuracy / 2;

L.marker(e.latlng).addTo(map)
 .bindPopup("Tu estas aqui, con " + radius + " metros de aproximacion").openPopup();

L.circle(e.latlng, radius).addTo(map);
 }
 function onLocationError(e) {
 alert(e.message);
}
 map.on('locationfound', onLocationFound);
 map.on('locationerror', onLocationError);

Primero se obtiene la ubicación del usuario usando el método map.locate, después creamos la función, donde crea una variable de radio para mostrar un indicador visual del rango de exactitud del GPS. Después se crea un marcador y se le asigna el pop up con el texto para mostrar la información de la exactitud del GPS.

Para finalizar se crea una función para mostrar en una alerta cualquier error que pudo haber sucedido a la hora de obtener la ubicación del usuario.

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión /  Cambiar )

Google photo

Estás comentando usando tu cuenta de Google. Cerrar sesión /  Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión /  Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión /  Cambiar )

Conectando a %s