Leaflet, una gran alternativa a Google maps... algo de profesionales👌💻
Leaflet es una librería para JavaScript que nos permite ingresar mapas en nuestro programa.
Si me lo preguntan para mi ha sido una herramienta asombrosa!!😁 Ya que pude hacer algo que pensaba que seria super complicado🙄
Pero durante la practica resulto ser muy Fácil!!
Primero nos guiamos en un video de YouTube que nos fue compartido por Slack!. Les adajunto el video al final de este post✌
Les comento que tuve un problema...
Trate de hacer este ejercicio en Visual Studio Code... pero no funciono... importe las librerias pero nada🤷♂️
Asi que mejor decidi hacerlo en un editor de codigo Online... que a mi gusto estuvo muy interesante ya que podia ver el resultado a un lado de la pantalla
Así es como se ve esta pantalla!! No es genial?
La libreria que toca usar es muy completa ya por su docuemntacion y sus plugins... esta es su pagina principal!
En fin les dejo como me quedo el ejercicio el cual debia constar:
- Crear un mapa de Quito
- Mostrar en el mapa pines que indiquen la dirección de al menos 7 de sus compañeros de clase
- Añadir un pin que represente al instituto
- Hacer una línea entre el instituto y cada estudiante
- Calcular el estudiante que viva más lejos del instituto
Me falto el ultimos ya que tuve problemas al hacerlos... pero sigo intentandolo!!!👍👌👊
Mas o menos asi me quedo:
El probema fue solucionado!!!😃.
Se tuvo que usar una libreria llamada Turf!!
Turf me salvo, ya que con unas simples lineas de código, el problema de el calculo de distancia se soluciono!!
Links:
Tutorial para realizar el mapa: https://www.youtube.com/watch?v=MDTIhWvIcDs
Entra a CodeOpen y empieza a crear!: https://codepen.io/
Visita Leaflet y mira sus funcionalidades!: https://leafletjs.com/
Visita mi repositorio en Github, te vas a sorprender..xD: https://github.com/mauricio403