# 系统架构图生成器

URL: https://discuvr.org/system-diagram/?hl=zh-hans
Last updated: 2026-11-08
MCP tool: `draw_system_diagram`

输入 A -> B 即可画出架构图和流程图。自动布局、可折叠分组、步骤编号，支持导出 PNG 和 SVG。

在白板工具里，每个框、每条箭头都要自己画、自己对齐。这里只需写下谁调用谁，一行一条箭头，布局自动完成。把相关服务放进分组，需要看全局时折叠成一个框，看细节时再展开。

## 功能说明

- 自动布局，从左到右或从上到下，边输入边更新。
- 根据名称选择形状：DB 是数据库，Kafka 是队列，User 是人员，以 ? 结尾的是判断。
- 分组可折叠成一个框，一张图同时满足高层视图和细节视图。
- 也可以在画布上拖动、连线、重命名和添加方框，每次修改都会写回文本。
- 步骤编号、手绘风格、导出 PNG 和 SVG、分享链接。不会上传任何内容。

## 工作原理

1. 输入类似 User -> Web App -> Orders DB 的行，或从模板开始。
2. 用 名称 { ... } 添加分组，冒号后写标签，异步调用用 -->。
3. 在概览和详情之间切换，拖动整理方框，然后导出或复制链接。

## 问题

**和 Excalidraw 有什么不同？**

Excalidraw 是自由白板，每个形状和箭头都要自己摆放。这里文本就是图，布局自动完成，新增一个服务只需一行，不用画框再重新对齐。如果只是随手草图，Excalidraw 仍然更合适。

**怎样同时展示高层和细节视图？**

用 名称 { ... } 把相关方框放进分组。概览会把每个分组折叠成一个框并合并箭头，详情再展开。也可以在分组标题处单独折叠某个分组。

**我的图会被保存到哪里吗？**

不会。图在您的浏览器中绘制，并保存在浏览器本地存储里。分享链接把图放在链接本身的 # 号之后，浏览器从不会把这部分发送给服务器。

**可以直接粘贴 Mermaid 流程图吗？**

不能直接粘贴，本工具没有 Mermaid 导入。A -> B 这样的普通行可以沿用，但有三处不同。删掉 graph TD 这一行表头，否则它会变成一个方框，改写为 direction: down。去掉 Mermaid 方括号里的标签，因为这里 [ ] 中的文字会被当作形状和颜色标签。另外，这里的 --> 画的是表示异步调用的虚线箭头，而在 Mermaid 中它是普通箭头；实线箭头请用 ->。

**除了 A -> B 还能写什么？**

A -> B: 文字 给箭头加标签，A --> B 画虚线箭头，A <-> B 画双向箭头，A <- B 指向反方向。名称 [db, blue] 设置形状和颜色；形状有 service、db、cache、queue、actor、client、storage、external、decision、terminal 和 note。title: 为图命名，direction: down 改为从上到下排列，以 # 或 // 开头的行是注释。一张图最多容纳 300 个方框、600 条箭头和 20,000 个字符的文本。

**折叠一个分组后，箭头会怎样？**

折叠分组内部各方框之间的箭头会隐藏，跨越分组边界的箭头则改为从分组方框出发或指向它。同一对方框之间的多条箭头会合并成一条更粗的箭头，保留第一个标签并加上计数。例如，Payments API 和 Ledger 都在 Payments { ... } 中时，Checkout -> Payments API 和 Checkout -> Ledger 两行在概览中会变成一条箭头 Checkout -> Payments x2。已折叠分组里的子分组会一起折叠；打开步骤时，编号按书写顺序跟随仍然可见的箭头。

## 更多开发者工具

- [JSON 格式化工具](https://discuvr.org/json-formatter/?hl=zh-hans)
- [Python Formatter](https://discuvr.org/python-formatter/?hl=zh-hans)
- [HTML 查看器](https://discuvr.org/html-viewer/?hl=zh-hans)
- [IP 子网计算器](https://discuvr.org/ip-subnet-calculator/?hl=zh-hans)

## 常一起使用

- [文本比较](https://discuvr.org/text-diff/?hl=zh-hans)

---

Part of Discuvr (https://discuvr.org/): Discuvr is a collection of free, focused tools for day-to-day professional work - office and data utilities, legal and compliance helpers, privacy and security checks, and developer formatters. Every tool has its own page, and most can also be called from ChatGPT or Claude over MCP.