Outils

Figma React Next.js TypeScript Tailwind CSS D3.js React Aria Motion

En février 2025, j’ai partagé le résultat d’un travail de plusieurs mois effectué sur mon temps libre : une visualisation de données interactive des assemblées législatives françaises depuis 1791 ! Depuis je continue en déclinant cet outil de visualisation pour d’autres pays.

Présentation

Le site se présente comme une frise de 233 ans (pour le cas de la France), dans laquelle on voit évoluer les rapports de forces entre les courants politiques. Chaque bande représente une législature, avec des segments colorés pour les différents partis élus. La largeur correspond au pourcentage de sièges.

Capture d’écran du site, avec une frise chronologique verticale, et des blocs de couleurs. Chaque rangée de blocs est reliée par des trapèzes de couleurs faisant la jonction entre deux blocs similaires d’une élection à l’autre.

Fonctionnement

Informations sur un parti

En survolant ou en touchant un segment coloré, vous pouvez voir le courant auquel le parti est affilié, la coalition avec laquelle il s’est engagé dans l’élection. En cliquant sur le nom du courant, vous trouverez des détails sur celui ci, ainsi que l’historique de ses partis, grâce à une requête Wikipédia.

Un bloc UMP est survolé, donnant des informations supplémentaires.
En survolant le résultat d’un parti à une élection, on voit son appartenance à un courant, ici 'Consertvateur', son pourcentage de députés, et éventuellement son appartenance à une coalition électorale et le pourcentage de députés de celle-ci.
Une modale est ouverte affichant une courte description du parti UMP, son logo, son appartenance au courant "Conservateur" et un lien Wikipédia.
Les détails obtenus en cliquant sur le nom du parti, grâce à une requête vers l'API de Wikipédia.

Organisation par courants politiques

Dans ce graphique, chaque parti (PS, LR…) incarne dans une période donnée un courant politique (Socialiste, Conservateur…), et chaque courant politique fait partie d’une famille de courants (Gauche, Droite…). Ces classements sont arbitraires, parfois peut-être étonnants.

Le détail d’un courant, avec sa description, son lien Wikipédia, et une liste de partis.
Pour chaque courant, sa modale permet de visualiser la liste de tous les partis qui y ont été liés. Il y a également un bouton pour masquer tous les partis liés à ce courant dans la frise.

Filtrage par courants ou familles

Ces courants sont regroupés dans des familles politiques, par exemple la famille Gauche va contenir les courants Socialiste-libéral et Socialiste-autogestionnaire.

Grâce à un système de filtrage, vous avez la possibilité de masquer des courants voire des familles entières. Ce filtrage permet de concentrer le graphique sur ce qui vous intéresse et d’observer plus en détail des rapports de force évoluer. Vous pouvez aussi filtrer aléatoirement, juste pour le fun.

La même frise, mais avec seulement des partis de gauche et du centre, se répartissant la totalité de la largeur du graphique.
Le résultat si on masque toutes les familles autres que la gauche et le centre.

Contexte historique

En marge du graphique, vous pouvez afficher une frise parallèle apportant un contexte historique, à l’échelle du pays. On y trouve luttes sociales, guerres, lois importantes, périodes de cohabitation, etc. En cliquant sur un événement on y trouve des infos complémentaires, de la même manière que pour les partis et courants.

La frise est compressée sur la droite, réduite à la moitié de la largeur. À sa gauche, une liste d’événements placés en face des dates correspondantes.
Des éléments de contexte historique peuvent aider à comprendre des changements importants lorsque ces deux données sont face à face.

Paramètres de la visualisation

Vous pouvez choisir d’afficher ou non des trapèzes entre les législatures, pour mieux visionner les évolutions de chaque courant politique dans le temps. On peut également mettre en avant les coalitions électorales en regroupant tous ses membres sous la même couleur.

La frise des partis, sans les trapèzes liant les partis d’une élection à l’autre.
La vision sans trapèze donne une vue plus condensée, qui peut permettre de mieux voir les blocs, mais moins l’évolution courant par courant.
La même frise, mais certains partis ont changé de couleur, et prennent celle d’un voisin proche, avec moins d’intensité.
La vision mettant les coalitions en avant permet de mieux se rendre compte de la présence d’alliances éléctorales pour les élections législatives. Cela permet aussi de voir dans chaque bloc quel parti a le leadership, car c’est le parti de la coalition avec le plus d’élus qui donne sa couleur aux autres partis de la coalition.

Évolutions

Multilingue

Le site a depuis été traduit en anglais et en allemand. Et peut être encore d’autres à l’avenir.

Déclinaisons sur différents pays

L’idée avec ce projet était de pouvoir l’étendre à d’autres pays, en entrant seulement les données mais sans réécrire de code. Au moment où j’écris ce texte, je l’ai étendu à la république fédérale d’Allemagne (RFA, à partir de 1949) et à la république démocratique d’Allemagne (RDA, 1949-1990). Je compte encore continuer sur d’autres pays, vous êtes invités à contribuer également.

Le même graphique avec les partis allemands, sans trop de changements entre les années, à part la montée de l’extrème droite.
Le graphique pour la RFA.
Le même graphique avec les partis est-allemands, avec pratiquement aucun changement jusqu’à l’élection de 1990.
Le graphique pour la RDA.

Contributions

Le projet est ouvert aux contributions sur Github ↗. Tout est expliqué dans le readme, autant au niveau du code que pour l’ajout de données. Je remercie d’ailleurs les différents contributeur·ices ↗ !

Explorer la visualisation