Mermaid 渲染器

使用说明

• 在左侧文本框中输入或粘贴 Mermaid 格式的图表代码
• 右侧区域会实时显示渲染后的图表
• 支持流程图、时序图、甘特图、类图等多种图表类型
• 点击“复制 Mermaid 代码”按钮可以复制当前的代码

Mermaid 语法介绍

graph TD
    A[开始] --> B{条件判断}
    B -->|是| C[处理1]
    B -->|否| D[处理2]
    C --> E[结束]
    D --> E

sequenceDiagram
    participant 客户端
    participant 服务器
    客户端->>服务器: 请求数据
    服务器-->>客户端: 响应数据

gantt
    title 项目计划
    dateFormat YYYY-MM-DD
    section 阶段1
    任务1 :a1, 2023-01-01, 30d
    任务2 :after a1, 20d

classDiagram
    class Animal {
        +name: string
        +move()
    }
    class Dog {
        +bark()
    }
    Animal <|-- Dog