Creating diagrams

Using Mermaid

The sphinxcontrib-mermaid extension allows you to embed Mermaid graphs in your documents, including general flowcharts, sequence diagrams, gantt diagrams and more.

It adds a directive to embed mermaid markup.

Sequence diagrams

This sequence diagram…

        sequenceDiagram
   participant Alice
   participant Bob
   participant Charlie
   Alice->Bob: How are you?
   loop Thinking
       Bob->Bob: I need a holiday...
   end
   Note right of Bob: Just reply <br/>something...
   Bob-->Alice: Great!
   Bob->Charlie: How about you?
   Charlie-->Bob: Jolly good!
    

…is created by this block of code:

.. mermaid::

   sequenceDiagram
      participant Alice
      participant Bob
      participant Charlie
      Alice->Bob: How are you?
      loop Thinking
          Bob->Bob: I need a holiday...
      end
      Note right of Bob: Just reply <br/>something...
      Bob-->Alice: Great!
      Bob->Charlie: How about you?
      Charlie-->Bob: Jolly good!

Class diagrams

This class diagram…

        classDiagram
 %% Relationships
 Animal <|-- Duck
 Animal <|-- Fish
 Animal <|-- Zebra

 %% Class Definitions
 class Animal {
     +String name
     +int age
     +isMammal() bool
     +mate()
 }

 class Duck {
     +String beakColor
     +swim()
     +quack()
 }

 class Fish {
     -int sizeInFeet
     -canEat()
 }

 class Zebra {
     +bool is_wild
     +run()
 }
    

…is created by this block of code:

.. mermaid::

   classDiagram
    %% Relationships
    Animal <|-- Duck
    Animal <|-- Fish
    Animal <|-- Zebra

    %% Class Definitions
    class Animal {
        +String name
        +int age
        +isMammal() bool
        +mate()
    }

    class Duck {
        +String beakColor
        +swim()
        +quack()
    }

    class Fish {
        -int sizeInFeet
        -canEat()
    }

    class Zebra {
        +bool is_wild
        +run()
    }

Links