- 
-
- mermaid
-
--Generation of diagrams and flowcharts from text in a similar manner as markdown.
-
Ever wanted to simplify documentation and avoid heavy tools like Visio when explaining your code?
-This is why mermaid was born, a simple markdown-like script language for generating charts from text via javascript. Try it using our editor.
-Code examples below:
-An example of a flowchart
-graph TD;
- A-->B;
- A-->C;
- B-->D;
- C-->D;An example of a sequence diagram
-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!Example code for a gantt diagram
-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 :1dPlay with mermaid using this editor or this live editor.
-Credits
-Many thanks to the d3 and dagre-d3 projects for providing
the graphical layout and drawing libraries! Thanks also to the
js-sequence-diagram project for usage of the grammar for the
sequence diagrams.
Mermaid was created by Knut Sveidqvist for easier documentation.
-Knut has not done all work by himself, here is the full list of the projects contributors.
-Downstream projects
-Mermaid is supported in a number of publishing systems and editors. Please report if a plugin/editor is missing from the list below:
--
-
- Support in LightPaper 1.2+. Howto. Discout with code MERMAID_25 -
- gitbook-plugin -
- light table -
- Confluence plugin -
- Using mermaid via docpad -
- Using mermaid in Jekyll -
- Using mermaid via Octopress -
- Mardown editor Haroopad -
- Plugin for atom -
Online live editor
-An editor is available for creating diagrams. With it you can quickly start writing mermaid diagrams. It is possible to:
--
-
- save the result as a svg -
- get a link to a viewer of the diagram -
get a link to edit of the diagram to share a diagram so that someone else can tweak it and send a new link back
-
-- - -