流程图绘制工具

Flowchart Drawer (Mermaid)

基于 Mermaid · 左侧编写代码,右侧实时渲染
💡 提示:选择上方图表类型可加载对应示例;编辑代码后图表会自动渲染(500ms 防抖)。所有内容仅在本地浏览器处理,不会上传到服务器。

📚 深度解析:流程图绘制工具

💡 常见使用场景

示例:用 Mermaid 语法画一张判断流程图
输入: graph TD A[开始] --> B{条件判断} B -->|满足| C[执行处理] B -->|不满足| D[结束] 页面会实时渲染(500ms 防抖),确认无误后点「导出 SVG / PNG」即可得到矢量或位图。

❓ 常见问题(FAQ)

支持哪些图表类型?
内置七种图表类型可一键切换,涵盖流程图、时序图、类图、状态图等常见结构,切换后自动按对应语法重新渲染。
绘制内容会丢失吗?
编辑内容自动保存到浏览器本地,刷新页面不会丢失;导出时支持 SVG(矢量、可二次编辑)与 PNG(位图)两种格式。

Formula & Standard References

ItemFormulaSource / Standard
Flowchart symbols rectangle process, diamond decision, rounded terminal ISO 5807 information processing flowchart symbols
Decision branching decision node with two or more branches ISO 5807 flowchart symbols
Flow line rules arrowhead shows direction, crossings avoided ISO 5807 flowchart symbols
📖关于「流程图绘制工具」 ▼

📝工具简介

Draw flowcharts with the open-source Mermaid diagram engine.

✨功能特点

🎯使用场景