Insert Mermaid diagrams
No new signups
Looking for Realm documentation? These documentation are for our old developer portal. Realm users should contact their account manager for details of the early access documentation.
You can insert mermaid charts and diagrams directly into markdown. This allows you to adhere to the docs-as-code philosophy.
To insert a diagram, create a code block and specify the mermaid
language, like this example:
```mermaid graph LR Start --> Stop ```
An example of a graph
An example of a sequence diagram
```mermaid 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 <br/>prevail... John-->Alice: Great! John->Bob: How about you? Bob-->John: Jolly good! ```
Sequence:
An example of a Gantt diagram
```mermaid gantt dateFormat YYYY-MM-DD title Adding GANTT diagram functionality to mermaid section A section Completed task :done, des1, 2014-01-06,2014-01-08 Active task :active, des2, 2014-01-09, 3d Future task : des3, after des2, 5d Future task2 : des4, after des3, 5d section Critical tasks Completed task in the critical line :crit, done, 2014-01-06,24h Implement parser and jison :crit, done, after des1, 2d Create tests for parser :crit, active, 3d Future task in critical line :crit, 5d Create tests for renderer :2d Add to mermaid :1d ```
Gantt: