Diagramme sous forme de code avec Mermaid dans Lucidchart

Accéder au menu Diagramme sous forme de code

Pour accéder au menu diagramme sous forme de code dans Lucidchart, procédez comme suit :

1. Sélectionnez l’icône Diagramme en tant que code dans la barre d’outils principale située à l’extrême gauche de l’espace de travail.

Générer un diagramme

Familiarisez-vous avec le processus de création de diagrammes sous forme de code en vous appuyant sur l’un des exemples fournis pour chaque type de diagramme pris en charge. Lorsque vous êtes prêt, générez un diagramme en écrivant votre propre code Mermaid.

Utiliser un exemple fourni

Pour faire un diagramme à l’aide des exemples fournis, suivez ces étapes depuis le menu digramme sous forme de code :

1. Sélectionnez +Nouveau diagramme Mermaid.
2. En bas de l’éditeur fourni, cliquez sur l’une des options d’exemple.
3. Le code sera automatiquement ajouté à l’éditeur pour le type d’exemple sélectionné.
4. Modifiez l’exemple de code au besoin.

Le diagramme sera généré dans la zone de travail à mesure que vous ajouterez et modifierez le code.

Créer un diagramme de zéro à l’aide de Mermaid

Pour créer un nouveau diagramme de zéro à l’aide du code Mermaid, suivez ces étapes depuis le menu du diagramme sous forme de code :

1. Sélectionnez +Nouveau diagramme Mermaid.
2. Saisissez votre code dans l’éditeur fourni.
3. Cliquez sur Générer.

Le diagramme sera généré dans la zone de travail à mesure que vous ajouterez et modifierez le code.

Modifier un diagramme

Un diagramme généré à partir de code doit être mis à jour en ouvrant et en modifiant le code. Pour ce faire :

1. Ouvrez l'éditeur de code associé de l'une des manières suivantes :
   • Cliquez sur le diagramme sur la zone de travail.
   • Accédez au menu des diagrammes sous forme de code, faites défiler, et sélectionnez le diagramme que vous souhaitez modifier.
2. Cliquez dans l'éditeur et apportez vos modifications.
   • Au fur et à mesure de vos modifications, le diagramme sur la zone de travail se mettra à jour en temps réel.

Le diagramme sera mis à jour sur la zone de travail.

Types de diagrammes pris en charge

Les types de diagrammes suivants sont pris en charge à l'aide de code Mermaid :

• Classe : décrivez la structure d’un système donné en modélisant ses classes, ses attributs, ses opérations et les relations entre ses objets.
• C4: tirez parti des quatre niveaux de modèles (contexte, conteneurs, composants et code) en fonction de votre public.
• Entité-association : représentez visuellement une base de données afin d’afficher les relations entre les champs.
• Logigramme: créez des logigrammes faciles à suivre qui couvrent des systèmes et des processus complexes.
• Gantt: représentez visuellement le calendrier et l’avancement lors de la gestion d’un projet.
• Ishikawa : créez des diagrammes en arêtes de poisson pour cartographier visuellement les relations de cause à effet lors de l’analyse des causes profondes.
• Treemap imbriqué : visualisez les structures de données hiérarchiques à l’aide de rectangles imbriqués.
• Diagramme radar : Créez un graphique permettant de comparer plusieurs variables quantitatives sur une grille radiale.
• Séquence : représente les processus et les objets qui vivent simultanément, ainsi que les messages qu’ils échangent entre eux pour remplir une fonction, avant la fin de la ligne de vie.
• État : créez un diagramme comportemental pour représenter les transitions entre divers objets.
• Graphique XY : créez des graphiques linéaires, à barres ou de dispersion complets pour visualiser les relations entre les points de données.

FAQ

Quelle version de Mermaid est prise en charge dans Lucidchart ? 
Lucidchart est optimisé pour prendre en charge la version 11.14 de Mermaid. 

Donnez votre avis sur cet article