跳转到主要内容
Mermaid 支持使用文本与代码构建流程图、时序图、甘特图及其他各类图表。 有关支持的图表类型与语法的完整列表,请参阅 Mermaid 文档
Mermaid flowchart example
```mermaid
  flowchart LR
    subgraph subgraph1
        direction TB
        top1[top] --> bottom1[bottom]
    end
    subgraph subgraph2
        direction TB
        top2[top] --> bottom2[bottom]
    end
    %% ^ 这两个子图完全相同,唯一区别在于与它们相连的链接:

    %% 链接到 subgraph1:subgraph1 的方向将被保留
    outside --> subgraph1
    %% subgraph2 内部的链接:
    %% subgraph2 继承顶层图(LR)的方向
    outside ---> top2
```

交互式控件

所有 Mermaid 图表都包含交互式缩放和平移控件,这些控件会出现在图表的右下角。
  • 放大/缩小:使用缩放按钮来放大或缩小图表。
  • 平移:使用方向箭头在图表中移动视图。
  • 重置视图:点击重置按钮返回到初始视图。
在处理无法完全显示在视口中的大型或复杂图表时,这些控件尤其有用。

语法

要创建 Mermaid 图表,请将图表定义写入 Mermaid 代码块中。
```mermaid
// 在此处编写您的 mermaid 图表代码
```