Ce cours vous propose une initiation compl\u00e8te \u00e0 Leaflet<\/strong>, la biblioth\u00e8que JavaScript libre et l\u00e9g\u00e8re d\u00e9di\u00e9e \u00e0 la cr\u00e9ation de cartes interactives web. \u00c0 l\u2019issue de la formation, vous serez capable de cr\u00e9er, personnaliser et publier vos propres cartes dynamiques avec donn\u00e9es g\u00e9ographiques, popups, couches th\u00e9matiques, et bien plus encore.<\/p>\n\n\n

\n
\n
Contenu <\/p>\nToggle<\/span>
Guide Leaflet complet : cr\u00e9er des cartes interactives pas \u00e0 pas<\/a>
Formation Leaflet \u2013 Cr\u00e9ez vos cartes interactives sur le web (environ 12 heures)<\/a>
Objectif du cours<\/a><\/li>
Public vis\u00e9<\/a><\/li><\/ul><\/li><\/ul><\/li>
Dur\u00e9e : environ 9-12 heures (r\u00e9parties en 6 s\u00e9ances)<\/a>
Programme :<\/a><\/li>
R\u00e9sultat attendu<\/a><\/li>
Soumettez votre projet individuel \u2013 S\u00e9ance 6<\/a><\/li>
starter kit<\/a><\/li><\/ul><\/li>
M\u00e9thode p\u00e9dagogique du cours Leaflet<\/a>
1. Diaporama de pr\u00e9sentation<\/a><\/li>
2. Texte explicatif d\u00e9taill\u00e9<\/a><\/li>
3. Exercice pratique en fin de s\u00e9ance<\/a><\/li>
4. Corrig\u00e9 accessible\u2026 mais apr\u00e8s l\u2019effort !<\/a><\/li>
En r\u00e9sum\u00e9<\/a><\/li><\/ul><\/li>
9. Ressources compl\u00e9mentaires<\/a><\/li>
Pr\u00eat(e) \u00e0 commencer ? Rendez-vous dans la premi\u00e8re s\u00e9ssion : Afficher une carte avec Leaflet !<\/a><\/li><\/ul><\/li><\/ul><\/nav><\/div>\n\n\n\n\n
<\/span>Public vis\u00e9<\/span><\/h3>\n\n\n\n
Ce cours s\u2019adresse :<\/p>\n\n\n\n
\n
Aux d\u00e9butants en cartographie web ;<\/li>\n\n\n\n
Aux professionnels SIG souhaitant int\u00e9grer leurs donn\u00e9es sur une carte web ;<\/li>\n\n\n\n
Aux d\u00e9veloppeurs front-end curieux d\u2019ajouter une brique cartographique \u00e0 leurs projets.<\/li>\n<\/ul>\n\n\n\n
Aucune connaissance pr\u00e9alable en Leaflet n\u2019est requise. Une familiarit\u00e9 basique avec HTML\/JavaScript est un plus, mais pas obligatoire.<\/p>\n\n\n\n
<\/span>Dur\u00e9e : environ 9-12 heures (r\u00e9parties en 6 s\u00e9ances)<\/span><\/h1>\n\n\n\n
<\/span>Programme :<\/span><\/h3>\n\n\n\n
\n
Introduction \u00e0 Leaflet<\/strong> en ligne<\/a>
\u2013 Installation, structure de base d\u2019une carte
\u2013 Ajout de fonds de carte (OSM, basemaps tiers)<\/li>\n\n\n\n
Couches et interactivit\u00e9<\/strong> <\/a>
\u2013 Points, polylignes, polygones
\u2013 Personnalisation, \u00e9v\u00e9nements, interactions<\/li>\n\n\n\n
Couches GeoJSON et donn\u00e9es externes<\/strong> <\/a>
\u2013 Chargement de donn\u00e9es GeoJSON
\u2013 Affichage conditionnel, symboles dynamiques<\/li>\n\n\n\n
Contr\u00f4les et outils d\u2019interface<\/strong> <\/a>
\u2013 Tooltips, popups, l\u00e9gendes, groupes de calques
\u2013 Contr\u00f4le de couches et filtres simples<\/li>\n\n\n\n
\u00c9v\u00e9nements utilisateur et interactivit\u00e9<\/a><\/strong>
\u2013 R\u00e9agir aux clics, survols, s\u00e9lection d\u2019\u00e9l\u00e9ments
\u2013 Cr\u00e9ation d\u2019une carte interactive simple<\/li>\n\n\n\n
Mini-projet de carte web personnalis\u00e9e<\/a><\/strong>
\u2013 R\u00e9alisation d\u2019un mini-projet
\u2013 Mise en ligne (GitHub Pages ou autre solution gratuite)<\/li>\n<\/ol>\n\n\n\n
<\/span>R\u00e9sultat attendu<\/span><\/h3>\n\n\n\n
\u00c0 la fin du cours, vous serez capable de cr\u00e9er une carte Leaflet fonctionnelle avec vos propres donn\u00e9es et de la mettre en ligne pour la partager avec le monde !<\/p>\n\n\n\n
<\/span>Soumettez votre projet individuel \u2013 S\u00e9ance 6<\/span><\/h3>\n\n\n\n
Dans le cadre de la derni\u00e8re s\u00e9ance de ce module, vous aurez r\u00e9alis\u00e9 un projet individuel int\u00e9grant les principaux \u00e9l\u00e9ments \u00e9tudi\u00e9s (couches, styles, interactions, contr\u00f4les, etc.).<\/p>\n\n\n\n
Nous vous invitons \u00e0 partager votre r\u00e9alisation<\/strong>, pour b\u00e9n\u00e9ficier d\u2019un retour personnalis\u00e9 et, si vous le souhaitez, figurer parmi les exemples valoris\u00e9s dans nos publications futures<\/p>\n\n\n\n
Comment faire ?<\/strong>
Publiez votre projet (code et carte) sur GitHub<\/strong> ou un service \u00e9quivalent (la m\u00e9thode sera d\u00e9crite dans la s\u00e9ance 6), puis vous nous enverrez le lien vers votre d\u00e9p\u00f4t<\/strong> via un formulaire mis \u00e0 votre disposition.<\/p>\n\n\n\n
Les projets seront examin\u00e9s selon les crit\u00e8res suivants :<\/p>\n\n\n\n
\n
Bonne pratique de l\u2019API Leaflet<\/li>\n\n\n\n
Lisibilit\u00e9 et organisation du code<\/li>\n\n\n\n
Qualit\u00e9 visuelle et fonctionnelle de la carte<\/li>\n\n\n\n
Pertinence du sujet et des donn\u00e9es choisies<\/li>\n<\/ul>\n\n\n\n
\n\n\n\n
Pour le d\u00e9roul\u00e9 du cours, vous pouvez t\u00e9l\u00e9charger un kit de d\u00e9marrage au format zip sur ce lien.<\/p>\n\n\n
\n\n
\n
\n
\n
$\"Ic\u00f4ne\"$ <\/div>\n
\n
<\/span>starter kit<\/a><\/span><\/h3>\n

<\/span>Public vis\u00e9<\/span><\/h3>\n\n\n\nCe cours s\u2019adresse :<\/p>\n\n\n\n\nAux d\u00e9butants en cartographie web ;<\/li>\n\n\n\nAux professionnels SIG souhaitant int\u00e9grer leurs donn\u00e9es sur une carte web ;<\/li>\n\n\n\n