Manipuler Leaflet pour créer des expériences cartographiques qui racontent quelque chose
Une carte n'est pas un fond de plan. C'est une scène. Leaflet, bien utilisé, transforme des données géographiques en narration visuelle, et chaque projet le prouve différemment.
Leaflet est une bibliothèque JavaScript légère, open source, conçue pour afficher des cartes interactives dans un navigateur. Sur le papier, c'est un outil de cartographie. En pratique, c'est un terrain de jeu pour raconter des histoires avec des données géolocalisées.
Trois projets récents illustrent bien jusqu'où on peut pousser cet outil quand on l'aborde avec une intention créative et narrative plutôt que purement fonctionnelle.
Milmurs : cartographier le street art dans les Caraïbes
Milmurs Production est un studio de création de fresques murales actif en Martinique, en France métropolitaine et à Montréal. L'enjeu de leur carte était de donner à voir la densité géographique de leur travail, de relier les œuvres à leurs territoires sans tomber dans un simple répertoire d'adresses.
La carte de milmurs.com/cartes regroupe les réalisations par zone, avec des popups enrichis qui permettent de visualiser chaque fresque en contexte. Le fond de carte sombre amplifie les couleurs des œuvres. La navigation est intuitive : on survole une zone, on clique, on se retrouve devant une murale dans une rue de Fort-de-France ou de Montréal.
Ce qui est intéressant côté code : la superposition de clusters dynamiques qui s'ouvrent à mesure qu'on zoome, et l'intégration de données personnalisées dans les marqueurs pour associer chaque point à un projet Kirby CMS.
Solidaires en Peloton : suivre l'aventure saison par saison
Le défi Solidaires en Peloton associe voile et vélo dans une aventure caritative qui change de parcours chaque année. La cartographie sur defi-voile-solidairesenpeloton.com devait permettre de revivre chaque édition, de voir les étapes, les escales, les distances parcourues.
L'interface propose quatre onglets correspondant aux saisons 2022, 2023, 2024 et 2025. Chaque saison affiche son propre tracé, ses propres points d'étape. On peut passer d'une année à l'autre et comparer visuellement les parcours, voir comment le défi a évolué.
Techniquement, le défi était de gérer des couches de données multiples (une par saison) de façon fluide, avec des transitions propres entre les états et une lecture claire des tracés même sur mobile. Leaflet gère ça nativement avec son système de layers, et un peu de JavaScript suffit à orchestrer l'affichage sélectif.
Mekaapolis : une carte comme porte d'entrée dans un univers
Mekaapolis est un projet artistique qui explore les mutations visuelles entre technologie, futurisme et cultures. La carte sur mekaapolis.com/fr/map est moins une carte géographique qu'une carte conceptuelle : un espace de navigation dans un univers fictionnel, où chaque point correspond à une création.
C'est l'usage le plus libre de Leaflet des trois. Le fond de carte devient un décor, les marqueurs deviennent des portails. On n'est plus dans la cartographie utilitaire, on est dans la cartographie narrative.
Pourquoi Leaflet plutôt qu'une autre solution
Leaflet pèse environ 40 Ko. Il n'a pas de dépendances. Il fonctionne sur tous les navigateurs modernes et sur mobile. Son API est propre et bien documentée. Et surtout, il laisse totalement la main sur le rendu visuel : fond de carte, style des marqueurs, popups, couches, animations.
Google Maps ou Mapbox sont puissants, mais ils imposent leur esthétique et leur logique. Leaflet, lui, s'efface derrière le projet. C'est ce qu'on cherche quand la carte est un élément de design autant qu'un outil de navigation.
Ce qui rend les projets cartographiques particulièrement satisfaisants à développer, c'est la sensation de transformer des données brutes (coordonnées GPS, tracés GPX, listes de lieux) en quelque chose qu'on a envie d'explorer. Le code devient une mise en scène.