📝工具简介
流程图绘制工具基于开源图表引擎 Mermaid，通过编写简洁的文本代码即可生成专业美观的图表。支持流程图、时序图、甘特图、类图、状态图、ER 图、饼图共七种常用图表类型，左侧编辑代码、右侧实时预览，所见即所得，并可一键导出 SVG 矢量图与 PNG 图片。全部计算与渲染均在浏览器本地完成，数据不上传，安全私密。
✨功能特点
- 七种图表类型一键切换
- 实时渲染（500ms 防抖）
- Tab 键缩进，编辑体验流畅
- 自动保存到本地，刷新不丢失
- 跟随深色 / 浅色主题
- 导出 SVG 与 PNG
- 纯前端运行，数据不上传
- 移动端响应式布局
🎯使用场景
- 梳理业务流程与决策分支
- 绘制接口调用时序图
- 规划项目开发甘特图
- 设计数据库 ER 模型
- 描述对象类与继承关系
- 梳理订单状态机流转
- 可视化数据占比饼图
- 编写技术文档与方案
💬常见问题
Mermaid 代码写错了没有渲染怎么办？
预览区下方会显示红色的错误提示信息，包含出错位置与原因，根据提示修正代码后会自动重新渲染。
导出的 PNG 背景是什么颜色？
PNG 会跟随当前主题：浅色模式下背景为白色，深色模式下背景为深色，方便直接粘贴到对应主题的文档中。
我的代码会被保存吗？
会。编辑内容会自动保存到浏览器 localStorage，下次打开同一页面时自动恢复，数据仅存在本地。
支持哪些图表类型？
目前支持流程图（flowchart）、时序图（sequence）、甘特图（gantt）、类图（class）、状态图（state）、ER 图（er）和饼图（pie）共七种，点击顶部标签可加载对应示例。