Search code examples
flowchartmermaid

Can I control the direction of flowcharts in Mermaid?

graph LR
A-->B-->C-->D-->E-->F;

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

I like to draw simple diagram using Mermaid. But it seems that flowcharts can only be top-to-bottom or left-to-right. Can I have more subtle control over the direction so the flowchart looks more compact (such as the below)?

Example flowchart

Solution

  • Mermaid's Graph charts only know about vertical or horizontal layouts. If you don't want to draw the compact layout that you want, you might try another text->diagram tool, such as http://blockdiag.com/en/blockdiag/examples.html#edge-folding

    If you don't want to do any setup, https://kroki.io/ supports most text->diagram tools, including BlockDiag. Here's BlockDiag's "folded" example as a Kroki-generated diagram:

    https://kroki.io/blockdiag/svg/eNotjEEKwkAMRfdzir_UhfQAA4JaT1FcTE2mDAYiNK0U6d1NwM17iwdvFH2-qJUJ3wRccDrjGrgF-sA9Jy9dh6pCYJoYxbybej_0-DQRjAwpmy7GFNX0DeGVJbuqYW7ER7_8r0OsmB457T_JhySR