Getting started with flowcharts
In this section, you will learn how to turn your diagram into a flowchart and how to set the direction your flowchart will be oriented in. When using Mermaid to draw flowcharts, you do not have to place the nodes yourself. Instead, you must provide the data of the flowchart to Mermaid through code. In this code, you specify what nodes there are in the flowchart and how they are connected to each other. With this information, Mermaid positions the nodes and draws the flowchart for you. Let's look closer at how to provide Mermaid with this data and the syntax of the diagram language.
The first thing Mermaid needs from your code is information about what type of diagram you are writing; this is the diagram type identifier. A flowchart has the graph type identifier of flowchart
and will always start with that keyword. The flowchart
keyword is followed by the direction of the flowchart. For example, the syntax could be something like flowchart TB
...