Formation Leaflet : Apprenez à créer des cartes interactives de qualité professionnelle
-62% de réduction
Pour ce 12ème et dernier volet dédié à l'apprentissage de l'utilisation de la librairie Javascript Leaflet, nous allons réaliser un exercice d'application global qui va reprendre l'ensemble des compétences Leafleat acquises tout au long de cette formation en ligne.
Nous allons d'abord réaliser un formulaire dynamique qui permet à l'utilisateur d'entrer une ville de départ, puis une ville d'arrivée.
Un programme JavaScript récupérera ces deux informations afin d'interroger l'API nominatim via la technologie Ajax. Cela nous permettra d'obtenir la géolocalisation (latitude et longitude). Nous pourrons afficher sur une carte, un marqueur de la ville de départ ainsi qu'un marqueur pour la ville d'arrivée. Enfin, nous afficherons le trajet entre ces deux villes.
Table des matières de cette formation JavaScript (durée : 1h34m)
-
- Découvrir ce que nous allons réaliser 00:03:27
- Ecrire le HTML et le CSS 00:07:26
- Ecouter la ville de départ 00:09:35
- Récupérer la latitude et la longitude de la ville de départ 00:04:52
- Récupérer la latitude et la longitude de la ville d'arrivée 00:07:25
- Afficher le trajet sur la carte 00:09:22
- Afficher les marqueurs 00:02:33
- Afficher ou cacher le champ demandant la ville d'arrivée 00:05:15
- Afficher ou cacher le champ demandant la ville de départ 00:03:30
- Créer un bouton de reload de la page courante 00:09:09
- Récupérer le nom de la ville de départ 00:09:36
- Afficher le nom de la ville de départ ainsi que le nom de la ville d'arrivée 00:06:14
- Mettre en place une animation d'attente 00:15:22
- Pour la prochaine fois 00:00:45
- Fichiers sourcestélécharger
- QCMaccéder
- Certificat
Formateur : Carl Brison
-
Merci pour ce bel outil, et à bientôt sur react!
-
Quel est le niveau requis pour suivre ce tuto ?intermédiaire
-
Que contient le fichier source ?Le code source de l'exercice
note moyenne
avis laissé