Frise chronologique
Racontez une histoire année par année
Qu’est-ce qu’un Frise chronologique ?
Une frise chronologique pose les événements dans l’ordre : histoire d’entreprise, jalons de projet, évolution produit, rétrospectives d’incident. Les frises Mermaid regroupent plusieurs événements par période et restent lisibles à toute taille.
La frise chronologique est le diagramme de la rétrospective : postmortems d’incident, diapositives sur l’histoire de l’entreprise, section « comment en sommes-nous arrivés là » d’un document de stratégie. Elle est particulièrement douée pour rendre les trous visibles — trois événements en mars puis plus rien jusqu’en septembre, c’est déjà un récit. Ce qu’elle ne sait pas faire, c’est l’échelle : les périodes sont des libellés espacés régulièrement, quel que soit l’intervalle, et rien n’est trié pour vous. Une période ne porte rien d’autre que du texte : ni responsable, ni lien, ni statut sur lequel filtrer.
Exemple en direct
timeline
title History of the project
2024 : Idea & prototype
2025 : First customers
: Seed funding
2026 : EU expansion
: AI featuresQuand l’utiliser
Erreurs fréquentes
Les périodes ne sont jamais triées
Mermaid dessine les périodes dans l’ordre où vous les avez écrites : une entrée 2026 placée au-dessus d’une entrée 2024 y reste. Il n’y a ni contrôle chronologique ni avertissement — triez la source vous-même avant de publier.
Les périodes placées avant la première section disparaissent
Dès qu’une frise contient une section, toute période déclarée avant cette première ligne section est retirée du rendu, silencieusement et sans erreur. Donnez à ces premières périodes une section à elles, ou n’en utilisez aucune.
Des phrases au lieu d’événements
Le texte d’un événement se coupe à une largeur fixe : une phrase entière devient quatre lignes empilées et gonfle la hauteur de toute la frise. Limitez chaque événement à quelques mots et laissez le détail au document qui l’entoure.
Syntaxe de base
timeline
title My timeline
2025 : Event A
: Event B
2026 : Event Ctimeline title History of the projectLe titre est facultatif mais joue le rôle d’une légende, ce qui compte dès que le diagramme est exporté seul dans une diapositive ou un postmortem.
2025 : First customersÀ gauche des deux-points se trouve le libellé de période — une année, un trimestre, « Sprint 12 », n’importe quoi. Il n’est jamais interprété comme une date, donc tous les formats passent.
2024 : Idea : PrototypeDes deux-points supplémentaires sur la même ligne ajoutent d’autres événements à la même période, ce qui garde la source compacte quand une année contient plusieurs moments notables.
section Early days 2024 : IdeaLes sections regroupent des périodes consécutives en une ère et les colorent ensemble — pratique pour séparer l’avant et l’après d’une levée de fonds, d’une migration ou d’une panne.
Questions sur ce diagramme
Une période peut-elle contenir plusieurs événements ?
Oui — ajoutez des lignes supplémentaires commençant par « : » sous la même période : elles s’empilent verticalement sous cette date.
Frise chronologique ou Gantt ?
La frise pour raconter le passé ou la vue d’ensemble (événements datés). Le Gantt pour planifier le travail (tâches avec durées et dépendances).
Puis-je ajouter une frise chronologique Mermaid à un postmortem Confluence ?
Confluence n’a pas de support Mermaid natif : utilisez une macro du Marketplace ou collez un SVG ou un PNG exporté. GitHub et GitLab rendent les frises directement depuis un bloc délimité, donc un postmortem gardé dans un dépôt ne demande aucun outillage supplémentaire.
Comment colorer les sections d’une frise chronologique ?
Les sections prennent leurs couleurs dans l’échelle du thème. Remplacez-les par une directive init sur la première ligne — %%{init: {"themeVariables": {"cScale0": "#4f46e5"}}}%% — où cScale0 est la première section, cScale1 la deuxième, jusqu’à cScale11. La palette est intégrée au SVG exporté.
Puis-je afficher une frise à la verticale ?
Non : les frises se dessinent à l’horizontale et il n’existe aucun réglage de direction. Elles ne reviennent jamais à la ligne, le diagramme ne fait que s’élargir. Pour un long historique à faire tenir dans une colonne étroite, un flowchart de haut en bas ou un gitGraph TB: exploitera bien mieux la place.
Puis-je transformer un rapport d’incident en frise automatiquement ?
Collez le compte rendu dans Mermaid Studio : l’IA en extrait les événements datés sous forme de frise que vous pouvez ensuite éditer. Traitez-la comme un premier jet : les périodes gardent l’ordre dans lequel elles ont été extraites, vérifiez donc la chronologie avant de publier.
Frise chronologique ou un autre type de diagramme ?
Frise chronologique ou parcours utilisateur ?
Les deux déroulent des étapes de gauche à droite. La frise parle du quand : des événements datés, sans acteur ni note. Le parcours parle du ressenti : des étapes ordonnées, un acteur, un score de satisfaction. Si personne n’a vécu ces événements, prenez la frise.
Frise chronologique ou graphe Git ?
La frise est plate : chaque événement tient sur une seule ligne. Le graphe Git, lui, se ramifie. Un historique de releases avec des branches de maintenance parallèles demande le graphe ; une histoire produit où seule la succession compte demande la frise.
Créez votre Frise chronologique maintenant
Décrivez-le en langage naturel — l’IA écrit le code Mermaid pour vous.
Ouvrir Mermaid Studio