El evento 'e' ya tiene las propiedades de 'latitude' y 'longitude', aparte de la propiedad objeto 'latlng', osea seria lo mismo poner e.latitude para la latitud, idem para la longitud. Tambien tiene un 'timestamp' que puede ser util, como por ejemplo para ver cuantos usuarios visualizan el mapa en un determinado rango de horas. Muy buen video, me ayudo mucho.
Excelente que expliques codigo corriendo, y con errores como todos... en locationfound, escribiste location"F"ound, y el código es case sensitive... A MI ME PASA todo el tiempo, GRACIAS
Muchas gracias por el video, aunque tengo un problema, he llegado hasta el minuto 30:00 pero al refrescar no se visualiza el mapa, no muestra ningún error en consola, el main.js esta incluido correctamente en el index.ejs (probé agregando alertas) y al div#map-template se le asignan automáticamente las clases de leaflet, Me pueden ayudar por favor!? Muchas gracias
Hola , fantastica la explicacion de Websocket...Segui las intucciones paso a paso y en lo cal funciona perfecto. Pero al subir la app en un servidor de AWS solo me despliega el mapa..(no muestra el marcador) aunque muesta cada vez que se conecta un usuario ..habilite el puerto 3000, Debo habilitar algo mas? ( tambien me di cuenta que no me pide mermiso para usar mi ubicacion del browser.
Bro gracias por la enseñanza muy bien tutorial, me gustaría poder recibir una ayuda lo mismo pero desde django y que leaflet este a la escucha de algún Ajax con coordenadas para pintar en el mapa, gracias amigo por compartir tu conocimiento
Amigo muchas gracias por tu video son excelentes Tengo una pregunta yo tengo un aparato gps q envia coordenadas a un puerto quisiera recibir esas coordenadas y mostrarlas en un mapa pienso q en este caso tendria q escuchar en otro puerto y de ahi actualizarlo en el mapa Espero tu ayuda muchas gracias
Excelente video! Una consulta leaflet ¿puede hacer el seguimiento en tiempo real si el usuario cambia de posición? ¿y como se podría realizar?, por ejemplo si se usara en un dispositivo móvil.
Hola si quiero que cuando ingrese un usuario nuevo este pueda ver todas las demás ubicaciones de los otros usuarios como podría hacerle una ayuda por favor.
Buenas noches! Excelente aporte!!! una consulta se puede integrar esto a un proyecto creado en IONIC 3 ? de ser así como sería la forma de integrarlo/fusionarlo?
Muchas gracias por el increible tutorial!!!. Aprovecho de consultar, tú sabes como implementar una función que descargue el mapa con sus tilelayers?. De antemano agradezco tu tiempo en responder :)
aparece mejor el otro usuario no usando el mismo navegador ... por cosas que desconosco ... me aparecen dos puntos distintos de servidor en santiago ... funciona sin suma 1 mas
Saludos, una pregunta: con leaflet y Nodejs yo puedo controlar un grupo de usuarios que sea alertado todo aquel usuario que se acerque a un sitio que yo determine como peligroso, Habia leido que leaflet no te permite hacer un render del movimiento del objeto en tiempo real, es verdad?
hola Fazt, oye me preguntaba si pudieras hacer un video sobre como marcar poligonos en un mapa, es que e estado buscando por todos lados y no encuentro nada que me ayude estaria muy agradecido de que me puedas proporcionar tu ayuda gracias
Muy buen contenido! Una consulta leaflet puede hacer el seguimiento en tiempo real si el usuario cambia de posición, que sea visible con un zoom relativamente cercano?
Lo que podrías hacer en ese caso para el seguimiento en tiempo real es usar WebSockets, y la api de Geolocalización del navegador, para ir pasándole los datos a Leaflet e ir actualizando el mapa
Hola a todos me aparece este mensaje cuando agrego el npm init --yes npm : El término 'npm' no se reconoce como nombre de un cmdle nombre o, si incluyó una ruta de acceso, compruebe que dicha En línea: 1 Carácter: 1 + ~~~ + CategoryInfo : ObjectNotFound: (npm:String) [] + FullyQualifiedErrorId : CommandNotFoundException
@@pekuruguay yo ando en ello hace rato, pero se me esta haciendo muy complicado, necesito convertir direccion en coordendas para medir la distancia de esos dos puntos, quiero el usuario registre la direccion destino y automatico el programa arroje, las coordenadas de ese lugar , lo de la basedatos ya lo tengo listo estoy estudiando esta plataforma,, parece que alli se puede www.mapbox.com
Dios me volvi loco ya que no me funcionaba el código, parece que en chromiun linux no funciona el mapa, pero en windows anda perfeto tanto en google chrome como en mozilla hoy 2020.
I DID NOT UNDERSTAND A SINGLE WORD THAT CAME OUT OF YOUR MOUTH. BUT YOU HELPED ME A LOT. THANK YOU.
Me quito el sombrero! Gracias por la masterclass!
El evento 'e' ya tiene las propiedades de 'latitude' y 'longitude', aparte de la propiedad objeto 'latlng', osea seria lo mismo poner e.latitude para la latitud, idem para la longitud. Tambien tiene un 'timestamp' que puede ser util, como por ejemplo para ver cuantos usuarios visualizan el mapa en un determinado rango de horas. Muy buen video, me ayudo mucho.
muchas gracias. Excelente tutorial
esto si esta fuerte mi hermano mucho celebro usted tiene son mucho codigo
Ahora me entero que Fazt vive en Londres XD
usa VPN :v
Que acaso no ves todos los comerciales del sponsor xdxdxd
Se agradece!
Podrías hacer algunos tutoriales y ejemplos de nuxt js ??
Saludos
Excelente, muchas gracias
Excelente que expliques codigo corriendo, y con errores como todos... en locationfound, escribiste location"F"ound, y el código es case sensitive... A MI ME PASA todo el tiempo, GRACIAS
gracias Fazt Code
mejor youtuber * * * * * *
Excelente video! Finalizado con éxito 🐱👤
Gracias por compartir
Muchas gracias por el video, aunque tengo un problema, he llegado hasta el minuto 30:00 pero al refrescar no se visualiza el mapa, no muestra ningún error en consola, el main.js esta incluido correctamente en el index.ejs (probé agregando alertas) y al div#map-template se le asignan automáticamente las clases de leaflet, Me pueden ayudar por favor!?
Muchas gracias
Hola , fantastica la explicacion de Websocket...Segui las intucciones paso a paso y en lo cal funciona perfecto. Pero al subir la app en un servidor de AWS solo me despliega el mapa..(no muestra el marcador) aunque muesta cada vez que se conecta un usuario ..habilite el puerto 3000, Debo habilitar algo mas? ( tambien me di cuenta que no me pide mermiso para usar mi ubicacion del browser.
Excelente, justo lo necesitaba y apareciste :')
Bro gracias por la enseñanza muy bien tutorial, me gustaría poder recibir una ayuda lo mismo pero desde django y que leaflet este a la escucha de algún Ajax con coordenadas para pintar en el mapa, gracias amigo por compartir tu conocimiento
hola faxt, te quiera decir estoy intentando aplicar lo que haces en el video y no puedo. quedo desactualziado no puedo ver el mapa..
Show, seria possível um tutorial com este map, utilizando o angular 7 ou superior.
Se puede agregar un marker con un click sobre el mapa y aparte que se guarde en la base de datos
Amigo muchas gracias por tu video son excelentes
Tengo una pregunta yo tengo un aparato gps q envia coordenadas a un puerto quisiera recibir esas coordenadas y mostrarlas en un mapa pienso q en este caso tendria q escuchar en otro puerto y de ahi actualizarlo en el mapa
Espero tu ayuda muchas gracias
Excelente video! Una consulta leaflet ¿puede hacer el seguimiento en tiempo real si el usuario cambia de posición? ¿y como se podría realizar?, por ejemplo si se usara en un dispositivo móvil.
Hola si quiero que cuando ingrese un usuario nuevo este pueda ver todas las demás ubicaciones de los otros usuarios como podría hacerle una ayuda por favor.
Una pregunta, como puedo hacer para que me bote los datos del Address, City, CountryCode y todo eso?
Alguien sabe cuál es el tema que está utilizando Fazt para los íconos?? Está muy bueno el vídeo para empezar con Leaflet con ejemplos prácticos :D
Hola fazt como puedo utilizar ests misma aplicación utilizando una base de datos que me esté mandando las ubicaciones
Buenas noches! Excelente aporte!!! una consulta se puede integrar esto a un proyecto creado en IONIC 3 ? de ser así como sería la forma de integrarlo/fusionarlo?
Muchas gracias por el increible tutorial!!!. Aprovecho de consultar, tú sabes como implementar una función que descargue el mapa con sus tilelayers?. De antemano agradezco tu tiempo en responder :)
¡Muy buen video!
Como siempre buen contenido.
como puedo cargar un mapa base de imágenes en este caso que sean tomadas por un drone
Cómo haría si agrego varios marcadores en el mapa y luego quiero que me guíen por voz para cada una de las marcas que agregué?
Excelente 👍
¿Alguna referencia si la aplicación se abre en un celular y ver en tiempo real su ubicación y seguimiento si este mueve?
Genial!! como hago para asignarles y ver los nombres de los usuarios conectados?
Gracias excelente video
aparece mejor el otro usuario no usando el mismo navegador ... por cosas que desconosco ... me aparecen dos puntos distintos de servidor en santiago ... funciona sin suma 1 mas
muy puntual...gracias
Saludos, una pregunta: con leaflet y Nodejs yo puedo controlar un grupo de usuarios que sea alertado todo aquel usuario que se acerque a un sitio que yo determine como peligroso, Habia leido que leaflet no te permite hacer un render del movimiento del objeto en tiempo real, es verdad?
Hola, gracias por el video, como podría enviar una notificación a mi email cuando otro usuario ingrese al servidor?
Alguien sabe como marca una ruta entre un punto y otro?
Me encantó
pero si me muevo no obtiene la ubicación,tengo q actualizar el navegador -.-
I send you two emails and I don't received any answer... :(
hola Fazt, oye me preguntaba si pudieras hacer un video sobre como marcar poligonos en un mapa, es que e estado buscando por todos lados y no encuentro nada que me ayude estaria muy agradecido de que me puedas proporcionar tu ayuda gracias
Excelente.
Puedo bajar el código fuente ?
Muy buen contenido! Una consulta leaflet puede hacer el seguimiento en tiempo real si el usuario cambia de posición, que sea visible con un zoom relativamente cercano?
Lo que podrías hacer en ese caso para el seguimiento en tiempo real es usar WebSockets, y la api de Geolocalización del navegador, para ir pasándole los datos a Leaflet e ir actualizando el mapa
Muchas gracias me sirvió
Hola a todos
me aparece este mensaje cuando agrego el npm init --yes
npm : El término 'npm' no se reconoce como nombre de un cmdle
nombre o, si incluyó una ruta de acceso, compruebe que dicha
En línea: 1 Carácter: 1
+ ~~~
+ CategoryInfo : ObjectNotFound: (npm:String) []
+ FullyQualifiedErrorId : CommandNotFoundException
explicando a la velocidad de la luz
Gran tutorial
muy buen curso, pero podrias hacer uno con un mapa a partir de una imagen local
como podria obtener los valores de las coordenadas y asignarlas a una caja de texto ? o guardarlas en la bd ? no logro dar con eso
ya lo lograste??
@@williamsalazar4811 no
@@pekuruguay yo ando en ello hace rato, pero se me esta haciendo muy complicado, necesito convertir direccion en coordendas para medir la distancia de esos dos puntos, quiero el usuario registre la direccion destino y automatico el programa arroje, las coordenadas de ese lugar , lo de la basedatos ya lo tengo listo estoy estudiando esta plataforma,, parece que alli se puede www.mapbox.com
El index.html?
Dios me volvi loco ya que no me funcionaba el código, parece que en chromiun linux no funciona el mapa, pero en windows anda perfeto tanto en google chrome como en mozilla hoy 2020.
Hola, tuviste problema con la variable lat?
Me marca en consola que no existe!
👍👏
Cobran?
me gustaría que hiciera lo mismo pero con Vuejs como podemos integrar Leaflet con vuejs y trabajar en tiempo real
me gusto el tema de socket ... ahora con click del mouse es mas facil enviar mi ubicacion 😅🤣🤣😂😂
#main.js
map.on('click', markerOnClick);
function markerOnClick(e)
{
console.log(e);
const marker = L.marker([e.latlng.lat ,e.latlng.lng]);
marker.bindPopup('Click');
map.addLayer(marker);
socket.emit('atackCoordinates', e.latlng);
}
socket.on('newAtackCoordinates',(cords) => {
console.log('Atack' + cords );
//const marker = L.marker([cords.lat ,cords.lng]);
//marker.bindPopup('Atack');
// map.addLayer(marker);
var circulo = L.circle([cords.lat ,cords.lng], {radius: 1000, color:'green'}).addTo(map)
circulo.bindPopup('Atack')
});
#socket.js
module.exports = io => {
io.on('connection',(socket) => {
console.log('Socket- New User Coneccted');
socket.on('userCoordinates', coords =>{
console.log(coords);
socket.broadcast.emit('newUserCoordinates',coords );
});
socket.on('atackCoordinates', coords =>{
console.log(coords);
socket.broadcast.emit('newAtackCoordinates',coords );
});
});
}