4.8/5 Trustpilot (1385 avis)
Formation Leaflet 1/12 - Prendre en main une carte OpenStreetMap
Formation Leaflet 1/12 - Prendre en main une carte OpenStreetMap
Ce Bundle sur la librairie Leaflet vous permettra d'acquérir les compétences nécessaires pour créer des cartes interactives de qualité professionnelle, à partir de données cartographiques de votre choix. Vous apprendrez à utiliser Leaflet, une bibliothèque JavaScript open source qui permet de créer des cartes interactives pour le Web.
Contenu de cette formation Leaflet complète :
- Introduction à Leaflet : Comprenez les bases de Leaflet, son architecture, et ses fonctionnalités principales.
- Gestion des Données Géospatiales : Apprenez à intégrer des données géospatiales dans vos cartes, y compris des marqueurs, des formes géométriques, et des couches de fond.
- Personnalisation des Cartes : Explorez les techniques pour personnaliser l'apparence de vos cartes en utilisant des styles, des pop-ups, et des icônes personnalisées.
- Interactivité et Événements : Découvrez comment rendre vos cartes interactives en réagissant aux événements tels que les clics, les survols, et les déplacements.
- Géolocalisation : Intégrez des fonctionnalités de géolocalisation pour permettre aux utilisateurs de rechercher des endroits et de naviguer sur la carte.
- Visualisation de Données : Apprenez à représenter des données complexes sur vos cartes, y compris des tracés de données et des clusters de marqueurs.
- Intégration de Plugins : Découvrez les plug-ins Leaflet populaires pour ajouter des fonctionnalités avancées à vos cartes.
Cette formation en ligne est adaptée aux débutants et aux développeurs expérimentés qui souhaitent maîtriser Leaflet pour créer des cartes interactives web à la pointe de la technologie.
À la fin de la formation, vous serez en mesure de concevoir des cartes web professionnelles et d'intégrer des fonctionnalités géospatiales avancées dans vos projets.
Un QCM vous sera proposé en fin de formation et vous permettra de valider les connaissances théoriques acquises pendant la formation.
Tous les fichiers de travail sont fournis !
Je reste disponible dans le salon d'entraide pour répondre à vos éventuelles questions sur ce cours.
Bonne formation !
Cours dans ce bundle
Formation Leaflet 2/12 - Coupler une carte OpenStreetMap avec une base de données
Formation Leaflet 2/12 - Coupler une carte OpenStreetMap avec une base de données
Formation Leaflet 3/12 - Aller plus loin avec l'intéraction de la carte
Formation Leaflet 3/12 - Aller plus loin avec l'intéraction de la carte
Formation Leaflet 4/12 - Obtenir la latitude et la longitude automatiquement
Formation Leaflet 4/12 - Obtenir la latitude et la longitude automatiquement
Formation Leaflet 5/12 - Apprendre à dessiner des figures géométriques sur une carte
Formation Leaflet 5/12 - Apprendre à dessiner des figures géométriques sur une carte
Formation Leaflet 6/12 - Application. Afficher la découpe des régions sur une carte
Formation Leaflet 6/12 - Application. Afficher la découpe des régions sur une carte
Formation Leaflet 7/12 - Afficher les restaurants disponibles dans un certain rayon
Formation Leaflet 7/12 - Afficher les restaurants disponibles dans un certain rayon
Formation Leaflet 8/12 - Définir un itinéraire sur une carte
Formation Leaflet 8/12 - Définir un itinéraire sur une carte
Formation Leaflet 9/12 - Manipuler les cartes
Formation Leaflet 9/12 - Manipuler les cartes
Formation Leaflet 10/12 - Exercice. Afficher les infos du lieu choisi par l'utilisateur
Formation Leaflet 10/12 - Exercice. Afficher les infos du lieu choisi par l'utilisateur
Formation Leaflet 11/12 - Exercice. Permettre à l'utilisateur d'entrer une adresse
Formation Leaflet 11/12 - Exercice. Permettre à l'utilisateur d'entrer une adresse
Formation Leaflet 12/12 - Exercice. Permettre à l'utilisateur de définir un itinéraire
Formation Leaflet 12/12 - Exercice. Permettre à l'utilisateur de définir un itinéraire
Plan détaillé des cours
Chapitre 1 : Premiers pas avec OpenStreetMap
1h17
Leçon 1Découvrir OpenStreetMap
Leçon 2Installer la librairie leaflet
Leçon 3Installer la couche de fond
Leçon 4Installer la couche de carte
Leçon 5Gérer le zoom de la carte
Leçon 6Modifier la carte
Leçon 7Installer la couche de marqueur
Leçon 8Installer un popup
Leçon 9Installer une couche de plusieurs marqueurs
Leçon 10Dynamiser le contenu des popups
Leçon 11Personnaliser le marqueur
Leçon 12Déplacer les popups
Chapitre 2 : Validation des acquis
41m19
Leçon 1Découvrir l'exercice
Leçon 2Mettre en place les bases
Leçon 3Mettre en place la couche de fond et la couche de carte
Leçon 4Mettre en place les marqueurs
Leçon 5Afficher un marqueur personnalisé
Chapitre 3 : Pour la prochaine fois
02m36
Leçon 1Pour la prochaine fois
Leçon 1
Prendre connaissance de ce que nous allons réaliser
06m39
Leçon 2
Mettre en place la base de données
08m02
Leçon 3
Mettre en place les bases de notre projet
05m49
Leçon 4
Insérer des datas
06m13
Leçon 5
Afficher la carte
06m44
Leçon 6
Afficher l'icone
05m33
Leçon 7
Mettre en place l'instance PDO
10m28
Leçon 8
Créer une classe d'entité
17m40
Leçon 9
Créer une classe manager
08m21
Leçon 10
Créer la méthode ReadAllVille
17m42
Leçon 11
Instancier notre classe d'entité et de manager
19m23
Leçon 12
Complèment
01m53
Leçon 13
Mettre en place la technologie AJAX
16m50
Leçon 14
Afficher tous les marqueurs
12m48
Leçon 15
Sécuriser l'affichage des marqueurs
03m10
Leçon 16
Tester notre programme
03m36
Leçon 17
Rendre notre script totalement dynamique
04m28
Leçon 18
Mettre en place une animation d'attente
12m47
Leçon 19
Programme l'affichage de l'animation d'attente
05m39
Leçon 20
Pour la prochaine fois
01m36
Leçon 1
Prendre connaissance de ce que nous allons réaliser
03m17
Leçon 2
Modifier la base de données
09m23
Leçon 3
Mettre en place une méthode de lecture des régions
11m02
Leçon 4
Mettre en place le menu déroulant
09m35
Leçon 5
Mettre en place la technologie AJAX
14m18
Leçon 6
Mettre en place l'appel à la méthode readAllRegion
12m33
Leçon 7
Modifier la méthode readAllVille
09m39
Leçon 8
Adapter notre script à la nouvelle méthode readAllVille
10m14
Leçon 9
Vider l'instance de la carte
07m10
Leçon 10
Dynamiser le titre de niveau 1
03m22
Leçon 11
Adapter le loading d'attente
08m54
Leçon 12
Pour la prochaine fois
01m38
Leçon 1
Revoir les bases de la mise en place d'une carte
10m38
Leçon 2
Découvrir l'API Nominatim
06m11
Leçon 3
Mettre en place un menu déroulant
06m38
Leçon 4
Communiquer avec l'API Nominatim
18m35
Leçon 5
Mettre en place la fonction reponse
05m05
Leçon 6
Afficher la carte de la ville demandée
03m37
Leçon 7
Améliorer notre page web
04m27
Leçon 8
Mettre en place un loader
16m17
Leçon 9
Pour la prochaine fois
01m30
Chapitre 1 : Dessiner des figures géométriques sur une carte
28m46
Leçon 1Apprendre à dessiner un cercle
Leçon 2Apprendre à dessiner un triangle
Leçon 3Apprendre à dessiner un rectangle
Leçon 4Apprendre à dessiner un polygone
Chapitre 2 : Installer des fichiers geojson
29m03
Leçon 1Récupérer des fichiers geojson
Leçon 2Afficher la carte sur une page web
Leçon 3Télécharger le fichier geoJson qui nous intéresse
Leçon 4Ecouter le chargement de la page
Leçon 5Interpréter un fichier geoJSON
Chapitre 3 : Pour la prochaine fois
01m42
Leçon 1Pour la prochaine fois
Leçon 1
Comprendre le travail à réaliser
02m59
Leçon 2
Ecrire le code HTML et CSS
07m12
Leçon 3
Récupérer les fichiers geoJson
02m23
Leçon 4
Créer la base de données
04m28
Leçon 5
Instancier la classe PDO
05m35
Leçon 6
Créer une classe d'entité
06m18
Leçon 7
Créer une classe manager
11m41
Leçon 8
Mettre en place la technologie Ajax
08m20
Leçon 9
Mettre en place le fichier readAllRegion
14m12
Leçon 10
Afficher les régions dans le menu déroulant
07m35
Leçon 11
Mettre en place une animation d'attente
15m17
Leçon 12
Ecouter la validation du formulaire
09m28
Leçon 13
Ecrire la méthode readRegion
06m25
Leçon 14
Appeler la méthode readRegion
07m07
Leçon 15
Afficher la carte de france
06m46
Leçon 16
Afficher la découpe de la région choisie
13m20
Leçon 17
Réactualiser la carte
05m49
Leçon 18
Pour la prochaine fois
01m23
Leçon 1
Comprendre le travail à réaliser
03m07
Leçon 2
Mettre en place les bases HTML et CSS
05m02
Leçon 3
Mettre en place la base de données
03m58
Leçon 4
Instancier la classe PDO
04m55
Leçon 5
Mettre en place la classe d'entité
05m27
Leçon 6
Mettre en place la classe manager
17m43
Leçon 7
Mettre en place la technologie Ajax
09m25
Leçon 8
Instancier la classe RestaurantManager
13m03
Leçon 9
Afficher la carte
05m57
Leçon 10
Afficher le cercle de recherche
04m37
Leçon 11
Afficher les marqueurs
08m53
Leçon 12
Afficher la popup d'un marqueur
03m17
Leçon 13
Contrôler la présence d'un rayon correct
05m48
Leçon 14
Mettre en place une animation d'attente
15m31
Leçon 15
Pour la prochaine fois
01m33
Chapitre 1 : Définir un parcours sur une carte
18m22
Leçon 1Créer un parcours entre deux villes
Leçon 2Créer un parcours entre plusieurs villes
Chapitre 2 : Exercice. Dynamiser la ville d'arrivée
1h03
Leçon 1Mettre en place les bases HTML et CSS
Leçon 2Mettre en place la technologie Ajax
Leçon 3Mettre en place la librairie leaflet routing machine
Leçon 4Mettre en place les icones
Leçon 5Mettre en place un titre de niveau 1
Leçon 6Mettre en place une animation d'attente
Chapitre 3 : Pour la prochaine fois
01m29
Leçon 1Pour la prochaine fois
Chapitre 1 : Définir un geocodeur
28m52
Leçon 1Mettre en place les bases HTML, CSS et JS
Leçon 2Mettre en place un itinéraire
Leçon 3Prendre en main le géocodeur
Leçon 4Afficher les icones
Leçon 5Ajouter des options
Chapitre 2 : Complèment d'informations
44m09
Leçon 1Modifier la tuile de la carte
Leçon 2Récupérer dynamiquement la latitude et la longitude
Leçon 3Afficher des marqueurs
Leçon 4Afficher un seul marqueur à la fois
Leçon 5Déplacer un marqueur
Leçon 6Récupérer les infos du lieu
Chapitre 3 : Pour la prochaine fois
01m37
Leçon 1Pour la prochaine fois
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
Leçon 1
Découvrir ce que nous allons réaliser
02m25
Leçon 2
Ecrire le HTML et le CSS
09m26
Leçon 3
Ecouter l'événement du clic sur le bouton du formulaire
06m38
Leçon 4
Appeler la librairie Nominatim
11m44
Leçon 5
Afficher le marqueur à l'adresse entrée par l'utilisateur
13m31
Leçon 6
Pour la prochaine fois
01m16
Leçon 1
Découvrir ce que nous allons réaliser
03m27
Leçon 2
Ecrire le HTML et le CSS
07m26
Leçon 3
Ecouter la ville de départ
09m35
Leçon 4
Récupérer la latitude et la longitude de la ville de départ
04m52
Leçon 5
Récupérer la latitude et la longitude de la ville d'arrivée
07m25
Leçon 6
Afficher le trajet sur la carte
09m22
Leçon 7
Afficher les marqueurs
02m33
Leçon 8
Afficher ou cacher le champ demandant la ville d'arrivée
05m15
Leçon 9
Afficher ou cacher le champ demandant la ville de départ
03m30
Leçon 10
Créer un bouton de reload de la page courante
09m09
Leçon 11
Récupérer le nom de la ville de départ
09m36
Leçon 12
Afficher le nom de la ville de départ ainsi que le nom de la ville d'arrivée
06m14
Leçon 13
Mettre en place une animation d'attente
15m22
Leçon 14
Pour la prochaine fois
45s
Avis des apprenants