Aller au contenu

Générateur de diagramme de flux

Décrivez un processus avec une chaîne d’étapes par ligne et obtenez un diagramme de flux avec le code Mermaid correspondant.

Traité localement dans votre navigateur

Options
Une chaîne par ligne avec « -> ». Étiquetez une flèche avec « -texte-> ». Ou collez du code Mermaid commençant par « flowchart ».0 caractères · 0 lignes
Le résultat apparaîtra ici.

Qu'est-ce que Générateur de diagramme de flux ?

Un diagramme de flux montre les étapes d’un processus et les décisions qui le font bifurquer. Cet outil propose deux façons d’en créer un : écrire un plan simple avec des flèches (« Début -> Vérifier -> Valide ? -oui-> Enregistrer »), ou coller du code Mermaid complet pour un contrôle total.

En mode plan, chaque ligne est une chaîne d’étapes. Deux libellés identiques réutilisent le même nœud, un libellé finissant par « ? » devient un losange de décision, Début et Fin deviennent des terminaux arrondis, et « -oui-> » place un libellé sur la flèche. Le code Mermaid généré s’affiche à côté du diagramme pour que vous puissiez le copier et l’affiner.

Comment ça marche ?

  1. Écrivez une chaîne par ligne, en reliant les étapes par « -> » et en étiquetant une flèche avec « -texte-> ».
  2. Choisissez la direction (haut-bas, gauche-droite, bas-haut, droite-gauche) et un thème.
  3. Vérifiez le diagramme et le panneau « Code Mermaid » ; collez à tout moment votre propre code Mermaid.
  4. Exportez le diagramme en SVG ou PNG, ou copiez le code Mermaid.

Cas d'usage courants

  • Documenter un processus d’inscription, de validation ou d’escalade du support.
  • Expliquer un algorithme ou une règle métier avec des branches de décision.
  • Transformer des notes de réunion sur un workflow en image partageable.
  • Obtenir rapidement un premier brouillon Mermaid, puis l’affiner dans l’éditeur.

Exemples

Essayez cette saisie dans l'outil ci-dessus :

Start -> Check input -> Valid? -yes-> Save record -> Send confirmation -> End
Valid? -no-> Show error message -> Check input

Confidentialité

Générateur de diagramme de flux s'exécute entièrement dans votre navigateur. Le texte ou les fichiers que vous fournissez sont traités sur votre appareil et ne sont ni envoyés, ni journalisés, ni stockés sur nos serveurs.

Limites

Le mode plan ne couvre que les nœuds, décisions et flèches étiquetées. Sous-graphes, styles personnalisés et fonctions avancées demandent du code Mermaid. Séparez les branches d’une décision en répétant son libellé sur une autre ligne.

Questions fréquentes

Comment dessiner une décision avec des branches oui et non ?

Terminez le libellé par un point d’interrogation, puis écrivez une ligne par branche : « Valide ? -oui-> Enregistrer » et « Valide ? -non-> Afficher l’erreur ». Les deux lignes partagent le même losange.

Que fait l’option de direction sur mon code ?

Elle ne réécrit que la première ligne (« flowchart TD » devient par exemple « flowchart LR »). Choisissez « Conserver celle du code » pour respecter une direction que vous avez saisie.

Puis-je coller du code Mermaid au lieu d’un plan ?

Oui. Si le texte commence par un mot-clé Mermaid comme flowchart ou graph, il est rendu tel quel, avec seulement la direction et le thème facultatifs.

Plus d'outils dans Markdown & diagrammes →