Adding Mermaid and other Diagrams

Mermaid

Using this help post I’ll try and add mermaid diagrams to this blog.

Themes can also be set for the diagrams by adding in %%{init: {'theme':'[theme.name]'}}%% to the code block

%%{init: {'theme':'neutral'}}%%

sequenceDiagram
    participant Alice
    participant Bob
    Alice->>John: Hello John, how are you?
    loop Healthcheck
        John->>John: Fight against hypochondria
    end
    Note right of John: Rational thoughts 
prevail!
    John-->>Alice: Great!
    John->>Bob: How about you?
    Bob-->>John: Jolly good!

GoAT diagrams

GoAT diagrams are supported natively, which is great!

BBooxx31BBooxx42

To generate this I used asciiflow to create the diagram, then you can just paste it into a goat code block.

This tool allows you to create all kinds of ASCII art, including formulas and such.

/\nk\|/=k!.n(!n-k)!

This tool also allows you to create graph diagrams in ascii format like the example

┌│└┌│└─w┬││││││││││││▽b──e─┌│└─a──b┬│││▽c┬││││││▽s──l─┌│└─o─┌│└─e──a┬▽c┬▽n┬│││▽n┬▽──y──h──t─┌│└─e────e──r──e┬▽b┬▽t────r──o──n──l─┐│┘──┐│┘─m──t──i─┌│└───e─┐│┘─n┬▽W┬▽──┬│││▽k──T────────F───────┐│┘─────┬│││▽─────┌│└─────┬▽v────────8───────┐│┘──────┌│└─────┬▽C────────C───────┐│┘──────┌│└─────┬▽s────────k─────┐│┘─i──────a─────┐│┘───┬│││││││││▽─┐│┘┐│┘