Comment ajouter plusieurs événements à la même période dans une chronologie Mermaid ?

Placez les événements supplémentaires sur des lignes indentées immédiatement sous l'étiquette temporelle, chacune commençant par `:`. Exemple : `2023 : ChatGPT publie GPT-4 \n : Anthropic lance Claude 2 \n : Google publie Gemini`. Chaque ligne `: événement` s'affiche comme une boîte d'événement distincte empilée sous le marqueur temporel `2023`. Ceci est utile pour les années comportant plusieurs jalons importants.

Comment regrouper les événements de la chronologie en sections ?

Utilisez `section NomDeLaSection` avant un groupe de périodes. Les sections séparent visuellement la chronologie en phases étiquetées — par exemple, `section Phase de développement` suivie des entrées annuelles, puis `section Phase de lancement` pour le groupe suivant. Les sections s'affichent comme des bandes d'arrière-plan colorées qui aident les lecteurs à naviguer dans de longues chronologies avec des phases distinctes.

Quelle est la différence entre une chronologie Mermaid et un diagramme de Gantt ?

Une chronologie Mermaid est optimisée pour montrer quand les événements se sont produits — elle accepte des étiquettes textuelles et des dates sans informations précises sur la durée ou les dépendances. Un diagramme de Gantt est mieux adapté à la planification — il montre les tâches avec des dates de début, des durées et des dépendances exactes. Utilisez une chronologie pour les rétrospectives, l'histoire et les aperçus de feuilles de route ; utilisez un diagramme de Gantt pour la planification de sprints, l'allocation des ressources et la gestion du temps.

Le type de diagramme de chronologie Mermaid est-il disponible sur GitHub et GitLab ?

GitHub a ajouté le rendu natif de Mermaid en 2022, et GitLab le prend en charge depuis 2019. Cependant, le type de diagramme `timeline` nécessite Mermaid v9.4 ou une version ultérieure. Si vous rencontrez une erreur d'analyse pour une chronologie sur GitHub ou GitLab, la plateforme peut utiliser une ancienne version groupée de Mermaid. Zolkit utilise toujours la dernière version de Mermaid, donc les diagrammes de chronologie sont entièrement pris en charge ici, quelle que soit la compatibilité de la plateforme.

Visualiseur de diagrammes de chronologie Mermaid

Affichez les diagrammes de chronologie Mermaid dans votre navigateur. Visualisez des événements historiques, des feuilles de route de produits et des jalons. Exportez en SVG ou PNG.

Code Mermaid

Aperçu

Entrez du code Mermaid pour prévisualiser votre diagramme

Les diagrammes de chronologie visualisent les événements dans un ordre chronologique, ce qui les rend idéaux pour les feuilles de route de produits, les récits historiques, les histoires d'évolution technologique et les rétrospectives de projets. Le type de diagramme `timeline` de Mermaid — introduit dans la v9.4 — offre un format clair et lisible pour marquer ce qui s'est passé et quand, sans la complexité d'un diagramme de Gantt complet. Les assistants IA utilisent les chronologies Mermaid lorsqu'on leur demande de résumer les développements historiques (« Montre l'histoire des frameworks JavaScript »), de présenter l'évolution d'un produit (« Cartographie les jalons de notre produit de 2020 à aujourd'hui ») ou d'esquisser une feuille de route de publication (« Crée une chronologie pour notre plan produit T1-T4 2025 »). Coller le code généré dans Zolkit rend la chronologie immédiatement visible, vous permettant de vérifier que les événements sont exacts, bien étiquetés et correctement espacés avant de les inclure dans une présentation ou un document. Le visualiseur de chronologie de Zolkit prend en charge plusieurs événements par période (affichés sous forme de boîtes empilées sous la même étiquette temporelle), le regroupement par sections pour organiser les phases, et toute la gamme de styles de chronologie Mermaid. Le fichier SVG ou PNG exporté est adapté aux présentations de vente, aux pages d'histoire d'entreprise, aux diapositives des réunions générales d'ingénierie et aux documents d'examen annuel.

Diagrammes Associés

← Visualiseur de Diagrammes Mermaid Visualiseur de diagrammes de Gantt Mermaid Visualiseur de graphes Git Mermaid Visionneuse de cartes mentales Mermaid

Visualiseur et Exportateur Gratuit de Diagrammes Mermaid en Ligne

Le Visualiseur de Diagrammes Mermaid de Zolkit vous permet de coller n'importe quel code Mermaid et de voir un diagramme rendu instantanément — aucune installation, aucune inscription, aucun téléversement sur serveur. Tout s'exécute dans votre navigateur, ce qui en fait le moyen le plus rapide de vérifier les diagrammes générés par IA depuis Claude, ChatGPT ou Gemini. Prend en charge tous les principaux types de diagrammes Mermaid : organigrammes, diagrammes de séquence, diagrammes de classes, diagrammes ER, diagrammes de Gantt, diagrammes d'états, cartes mentales, graphes Git, diagrammes circulaires et chronologies.

Aperçu Instantané en Direct

Les diagrammes sont rendus automatiquement pendant que vous tapez, avec un délai de 300 ms pour qu'il ne soit jamais lent.

100% Privé

Tout le rendu se fait dans votre navigateur à l'aide de mermaid.js. Votre code n'est jamais envoyé à aucun serveur.

Exporter SVG & PNG

Téléchargez votre diagramme en tant que SVG vectoriel net ou PNG 2× haute résolution prêt pour vos documents et présentations.

Tous les Types de Diagrammes Mermaid

Prend en charge les organigrammes, diagrammes de séquence, diagrammes de classes, diagrammes ER, diagrammes de Gantt, cartes mentales, graphes Git, et plus encore.

Prêt pour les Diagrammes IA

Conçu pour l'ère de l'IA — prévisualisez directement les diagrammes générés par Claude, ChatGPT, Gemini, ou tout LLM.

Toujours Gratuit

Aucun compte requis, aucune limite d'utilisation, aucun filigrane. Le visualiseur Mermaid de Zolkit est entièrement gratuit pour toujours.

Comment Prévisualiser un Diagramme Mermaid

1
Collez votre code Mermaid dans l'éditeur à gauche — vous pouvez le copier depuis un assistant IA ou l'écrire manuellement.
2
Le diagramme est rendu instantanément dans le panneau d'aperçu à droite. S'il y a une erreur de syntaxe, un message explique le problème.
3
Cliquez sur 'Exporter SVG' ou 'Exporter PNG' pour télécharger votre diagramme sous forme de fichier prêt pour la documentation, les présentations ou le partage.