Formation Leaflet 10/12 - Exercice. Afficher les infos du lieu choisi par l'utilisateur
Problème de lecture
Cette vidéo ne semble pas disponible
00:00
00:00
Sous-titres non disponibles
1h22
de formation
11
leçons vidéo
1
chapitre
Intermédiaire
niveau requis
Carl Brison
Carl Brison
Formateur certifié

Formation Leaflet 10/12 - Exercice. Afficher les infos du lieu choisi par l'utilisateur

4.8/5 Trustpilot (1399 avis) Satisfait ou remboursé
1h22
de formation
11
leçons vidéo
1
chapitre

Pour ce 10ème volet dédié à l'apprentissage de l'utilisation de la librairie Javascript Leaflet, nous allons réaliser un exercice d'application concrète de ce que nous avons appris ensemble tout au long de cette formation Leaflet.

Formation Leaflet / Exercice pratique : Afficher les infos d'un lieu sur une carte

L'exercice que nous allons réaliser sera d'afficher sur la page web, les informations liées au clic de l'utilisateur sur la carte. Ainsi, peu importe où l'utilisateur cliquera sur la carte, nous lui afficherons :

  • le nom de la ville,
  • le code postal,
  • le département
  • ainsi que la région liée.
Afin de suivre ce cours en ligne dans de bonnes conditions, il est préférable de connaître :
  1. Les requêtes Ajax en JavaScript
  2. Le JavaScript moderne

Qu’allez-vous apprendre dans ce cours ?

Plan de cours
Leçon 1
Découvrir ce que nous allons faire
Leçon 2
Ecrire les codes de base HTML et CSS
Leçon 3
Ecrire les codes de base de la librairie Leaflet
Leçon 4
Ecouter le clic sur la carte
Leçon 5
Récupérer les infos du lieu retournés par Nominatim
Leçon 6
Afficher les infos du lieu retournés par Nominatim
Leçon 7
Afficher un marqueur sur la carte

Table des matières

Leçon 1

Découvrir ce que nous allons faire

01m57
Leçon 2

Ecrire les codes de base HTML et CSS

07m
Leçon 3

Ecrire les codes de base de la librairie Leaflet

04m26
Leçon 4

Ecouter le clic sur la carte

08m22
Leçon 5

Récupérer les infos du lieu retournés par Nominatim

10m04
Leçon 6

Afficher les infos du lieu retournés par Nominatim

10m22
Leçon 7

Afficher un marqueur sur la carte

07m55
Leçon 8

Déplacer le marqueur sur la carte

12m44
Leçon 9

Effacer le marqueur précédent

03m28
Leçon 10

Mettre en place une animation d'attente

15m25
Leçon 11

Pour la prochaine fois

01m02

Aperçus

Avis des apprenants

Détail des avis
1
Commentaire
5/5
Note moyenne
5/5
1
4/5
0
3/5
0
2/5
0
1/5
0
Bernard Chabloz
Bernard Chabloz
Publié le 12/10/2023
5
L'outil croît! Je me disais bien qu'on devait pouvoir utiliser Nominatim "à l'envers", il faut juste conditionner l'affichage de la ville ou du village au type présent dans la réponse, et qui peut être "city", "town" ou "village"; ainsi on obtient presque partout (sur le globe) un nom.
Carl Brison
Carl Brison
Merci beaucoup pour votre commentaire ;-)

Vos questions sur le cours

Quel est le niveau requis pour suivre ce tuto ?

intermédiaire

Que contient le fichier source ?

Le code source complet de l'exercice
Choisissez votre accès

Deux façons de suivre cette formation

À l'unité
Pour vous former sur ce sujet précis
16,99€
Paiement unique, sans abonnement
Accès à vie à cette formation
1h22 de vidéo • 1 chapitre
Satisfait ou remboursé voir conditions
Accès immédiat après paiement
Avec l'abonnement
Pour progresser en continu
34,90€ 27,91€ /mois
Le 1er mois, puis 34,90€ - sans engagement
Cette formation + 6 791 autres en illimité
Plus de 20 nouvelles formations par mois
Résiliable en 1 clic, à tout moment
Profiter de l'offre
Accès immédiat, pendant votre abonnement

Inclus dans les deux formules

  • Hors connexion via l'app Tuto.com
  • Salon d'entraide pour vos questions
  • Certificat de complétion
Paiement sécurisé 1,4 million d'apprenants 4.8/5 Trustpilot
Logo carte-bancaire-monoLogo visa-monoLogo mastercardLogo paypal-monoLogo klarna-monoLogo apple-pay-monoLogo google-pay-mono
Une question avant de choisir ? Écrivez-nous ou appelez le 01 84 80 80 29 (du lundi au vendredi, 10h-12h et 14h-16h)
Continuez votre progression

Formations complémentaires

Les apprenants qui suivent cette formation s'intéressent aussi à :

+ 1,400,000 d’apprenants et d’entreprises se forment au quotidien sur Tuto.com
  • Logo adobe
  • Logo etapes
  • Logo nikon
  • Logo arte
  • Logo xp-pen
  • Logo citia
  • Logo universal
  • Logo jc-decaux
  • Logo cite-science
  • Logo credit-agricole
  • Logo om
  • Logo fff
Paiement 100% sécurisé

Vos données sont chiffrées et protégées pendant toute la transaction.

  • visa-mono
  • mastercard-alt
  • maestro-alt
  • paypal-mono
  • klarna-mono
  • apple-pay-mono
  • google-pay-mono
Besoin d’aide ?

Notre équipe répond à vos questions du lundi au vendredi de 10h à 12h et de 14h à 16h.
Support par e-mail ou par téléphone au 01 84 80 80 29.

Abonnement 34,90€/mois

Attendez ! 🤗

Accédez à plus de 1426 tutos gratuits

Notre politique de protection des données