Créer des cartes à l'aide de Leaflet
Problème de lecture
Cette vidéo ne semble pas disponible
00:00
00:00
Sous-titres non disponibles
1h28
de formation
14
leçons vidéo
5
chapitres
Intermédiaire
niveau requis
Codeconcept
Codeconcept
Formateur

Créer des cartes à l'aide de Leaflet

4.8/5 Trustpilot (1400 avis) Satisfait ou remboursé
1h28
de formation
14
leçons vidéo
5
chapitres

Depuis que Google Maps impose de saisir un numéro de carte bleue afin d'utiliser son (remarquable) service, cela a motivé certains développeurs à aller découvrir des concurrents. En tête de ceux-ci, la librairie Leaflet, open source et gratuite.

Ainsi, si vous souhaitez afficher des cartes interactives sur un site web, cette formation en vidéo est faite pour vous.
Nous mélangerons théorie et cas pratique.
 

Au programme de ce tuto Leaflet

Découvrez dans cette formation Leaflet en ligne qui va à l'essentiel comment :

  • créer une carte,
  • ajouter un marqueur,
  • utiliser un des nombreux layers disponibles,
  • écouter des events,
  • afficher des popups.

Puis, une fois que vous aurez acquis ces compétences essentielles, nous élèverons le niveau en ajoutant des fonctionnalités fréquemment demandées :

  • ajouter des marqueurs personnalisés,
  • ajouter un cercle sur une carte autour d'une région,
  • interagir à l'aide d'un curseur en dehors de votre carte sur le cercle de votre carte.

Enfin, nous ajouterons encore de nouvelles fonctionnalités moins demandées, mais indispensable dans certaines applications :

  • utiliser un service de geocoding permettant d'afficher une adresse à partir de coordonnées GPS,
  • écouter des événements émis par une carte,
  • ajouter et supprimer des listeners sur une map,

Tout cela sans plus avoir à payer de frais de licence (pour rappel, leaflet est totalement gratuit et opensource).
Les fichiers sources sont fournis avec le cours.
Je reste disponible dans le salon d'entraide pour répondre à vos éventuelles questions sur le tuto.

Bonne découverte de Leaflet ! 

Qu’allez-vous apprendre dans ce cours ?

Plan de cours
Chapitre 1
Introduction
Chapitre 2
Markers, layers et popups
Chapitre 3
Markers personnalisés
Chapitre 4
Ajouter un cercle et le contrôler depuis un curseur extérieur
Chapitre 5
Trouver une adresse à partir de coordonnées GPS

Table des matières

Chapitre 1 : Introduction

13m15
 
Leçon 1Pourquoi utiliser Leaflet plutôt que Google Maps ?
Leçon 2Créer notre première carte leaflet

Chapitre 2 : Markers, layers et popups

27m17
 
Leçon 1Ajouter des markers
Leçon 2Utiliser d'autres layers
Leçon 3Afficher les nouvelles coordonnées dans la page html
Leçon 4Créer une popup

Chapitre 3 : Markers personnalisés

10m01
 
Leçon 1Associer une icône personnalisée à un marker
Leçon 2Positionner une popup sur notre marker personnalisé

Chapitre 4 : Ajouter un cercle et le contrôler depuis un curseur extérieur

13m26
 
Leçon 1Ajouter un cercle sur notre carte
Leçon 2Brancher un range element sur le cercle de notre carte

Chapitre 5 : Trouver une adresse à partir de coordonnées GPS

24m33
 
Leçon 1Utiliser le service de geocoding
Leçon 2Afficher l'adresse
Leçon 3Ecouter des événements émis par une carte
Leçon 4Ajouter et supprimer des listeners sur une map

Aperçus

Avis des apprenants

Détail des avis
2
Commentaires
4,5/5
Note moyenne
5/5
1
4/5
1
3/5
0
2/5
0
1/5
0
Ogoxe Ogoxe
Ogoxe Ogoxe
Publié le 28/03/2020
Va à l'essentiel, explications claires par l'exemple, mais formation trop courte, on aimerait faire le tour de toutes les possibilités qu'offre Leaflet.
Jean-Pierre Bernard
Jean-Pierre Bernard
Publié le 18/10/2019
Bon tuto avec des cas bien concrès

Vos questions sur le cours

Quel est le niveau requis pour suivre ce tuto ?

intermédiaire

Bonjour, est-ce que ce tuto explique aussi comment personnaliser l'apparence graphique (couleurs ou thème) des cartes pour l'adapter visuellement à son site ?

Bonjour, ce tuto montre comment changer de layer (en utilisant une des nombreuses layers créées par la communauté) et donc de modifier l'apparence d'une carte. En revanche, il n'apprend pas à créer sa propre layer totalement custom.

Deux façons de suivre cette formation

À l'unité
Pour vous former sur ce sujet précis
18,99€
Paiement unique, sans abonnement
Accès à vie à cette formation
1h28 de vidéo • 5 chapitres
Satisfait ou remboursé voir conditions
Accès immédiat après paiement
Avec l'abonnement
Pour progresser en continu
34,90€ /mois
Sans engagement
Cette formation + 6 779 autres en illimité
Plus de 20 nouvelles formations par mois
Résiliable en 1 clic, à tout moment
Commencer avec l’abonnement
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)

Formations complémentaires

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

Abonnement 34,90€/mois

Attendez ! 🤗

Accédez à plus de 1429 tutos gratuits

Notre politique de protection des données