Mermaid is awesome

Written by

in

After the great success of Markdown, someone came up with the brilliant idea of making charts based on it. So, I’m in love with Mermaid! 🙂

It has a JavaScript renderer, which can be wrapped into other things—like, say, a WordPress plugin—and produce visuals like this:

flowchart TD
    A[Find Treasure Map] -->|Decipher clues| B(Start Adventure)
    B --> C{Choose a path}
    C -->|Forest| D[Meet Talking Tree]
    C -->|Mountain| E[Discover Hidden Cave]
    C -->|Desert| G[Find Oasis with Genie]
    C -->|Haunted Mansion| H[Solve Puzzles]
    C -->|Mystic Island| I[Encounter Mermaids]

The above is generated from the following simple markup:

flowchart TD
    A[Find Treasure Map] -->|Decipher clues| B(Start Adventure)
    B --> C{Choose a path}
    C -->|Forest| D[Meet Talking Tree]
    C -->|Mountain| E[Discover Hidden Cave]
    C -->|Desert| G[Find Oasis with Genie]
    C -->|Haunted Mansion| H[Solve Puzzles]
    C -->|Mystic Island| I[Encounter Mermaids]

Or a more complex one (part of the ancient vpopmail system I’m fiddling with):

graph TD
    subgraph get_arguments
        A["Start: vdelivermail receives email: no-reply-office-sofia\@domain.com"] --> B["Get EXT and HOST"]
        B --> C{"EXT contains '-'?"}
        C -->|Yes| D["Split EXT at *first* '-' - TheUser = no-reply-office-sofia"]
        D --> E["TheUserExt = no"]
        E --> F["TheExt = reply-office-sofia"]
        F --> G["Replace '.' with ':' in TheExt"]
        C -->|No| H["TheUserExt = EXT"]
        H --> I["TheExt = ''"]
        G --> J["Continue"]
        I --> J
    end
    J --> K{"User no-reply-office-sofia found?"}
    K -->|No| M{"QMAIL_EXT & no-reply-office-sofia != no?"}
    M -->|Yes| N{"vauth_getpw?"}
    N -->|Yes| L["checkuser() TheUserExt=no"]
    N -->|No| O["usernotfound()"]
    M -->|No| O
    L --> P["check_forward_deliver"]
    subgraph check_forward_deliver
        P --> Q{"TheExt (reply-office-sofia) is not empty?"}
        Q -->|Yes| R["Try .qmail-reply-office-sofia"]
        R --> S{"Opened?"}
        S -->|Yes| T1["Process .qmail-reply-office-sofia"]
        S -->|No| U["Loop backwards through TheExt"]
        U --> V{"Current/Previous char is '-'?"}
        V -->|Yes, i=16| W1["Try .qmail-reply-office-default"]
        W1 --> X1{"Opened?"}
        X1 -->|Yes| T2["Process .qmail-reply-office-default"]
        X1 -->|No| U
        V -->|Yes, i=6| W2["Try .qmail-reply-default"]
        W2 --> X2{"Opened?"}
        X2 -->|Yes| T3["Process .qmail-reply-default"]
        X2 -->|No| U
        V -->|Yes, i=0| W3["Try .qmail-default"]
        W3 --> X3{"Opened?"}
        X3 -->|Yes| T4["Process .qmail-default"]
        X3 -->|No| U
        Q -->|No| Y["Try .qmail"]
        Y --> Z{"Opened?"}
        Z -->|Yes| T5["Process .qmail"]
        Z -->|No| AA["Return -1"]
        T1 --> AB["Return 1"]
        T2 --> AB
        T3 --> AB
        T4 --> AB
        T5 --> AB
    end

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *