GitHub Markdown now Supports Mermaid Diagrams

Mermaid diagrams provide a way to display graphs defined as plain text. Some markdown renderers support this as a plugin. GitHub now supports it.

example

You can define nodes like this in mermaid, and GitHub will now render them as a prett…


This content originally appeared on DEV Community and was authored by DEV Community

Mermaid diagrams provide a way to display graphs defined as plain text. Some markdown renderers support this as a plugin. GitHub now supports it.

example

You can define nodes like this in mermaid, and GitHub will now render them as a pretty graph diagram. Its rendered in svg, so its searchable with control f and everything.

  graph TD;
      A-->B;
      A-->C;
      B-->D;
      C-->D-->OUT;
      E-->F-->G-->OUT

Here is what the example looks like on GitHub

Links


This content originally appeared on DEV Community and was authored by DEV Community


Print Share Comment Cite Upload Translate Updates
APA

DEV Community | Sciencx (2022-02-24T20:51:20+00:00) GitHub Markdown now Supports Mermaid Diagrams. Retrieved from https://www.scien.cx/2022/02/24/github-markdown-now-supports-mermaid-diagrams/

MLA
" » GitHub Markdown now Supports Mermaid Diagrams." DEV Community | Sciencx - Thursday February 24, 2022, https://www.scien.cx/2022/02/24/github-markdown-now-supports-mermaid-diagrams/
HARVARD
DEV Community | Sciencx Thursday February 24, 2022 » GitHub Markdown now Supports Mermaid Diagrams., viewed ,<https://www.scien.cx/2022/02/24/github-markdown-now-supports-mermaid-diagrams/>
VANCOUVER
DEV Community | Sciencx - » GitHub Markdown now Supports Mermaid Diagrams. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2022/02/24/github-markdown-now-supports-mermaid-diagrams/
CHICAGO
" » GitHub Markdown now Supports Mermaid Diagrams." DEV Community | Sciencx - Accessed . https://www.scien.cx/2022/02/24/github-markdown-now-supports-mermaid-diagrams/
IEEE
" » GitHub Markdown now Supports Mermaid Diagrams." DEV Community | Sciencx [Online]. Available: https://www.scien.cx/2022/02/24/github-markdown-now-supports-mermaid-diagrams/. [Accessed: ]
rf:citation
» GitHub Markdown now Supports Mermaid Diagrams | DEV Community | Sciencx | https://www.scien.cx/2022/02/24/github-markdown-now-supports-mermaid-diagrams/ |

Please log in to upload a file.



There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.

Related Posts