绘制架构图、流程图和系统设计图是技术工作中不可避免的任务，但传统绘图工具的学习曲线和操作效率一直是痛点。draw.io（现名 diagrams.net）凭借免费和功能丰富成为最受欢迎的开源绘图工具之一，但手动拖拽和连线的方式在面对复杂图表时仍然耗时。Next-AI-Draw-IO 将 LLM 的自然语言理解能力与 draw.io 的专业图表渲染引擎结合，让用户通过描述文字直接生成和修改图表。这一项目在 GitHub 上快速获得关注，截至 2026 年 3 月已积累超过数千颗星。
核心功能解析
Next-AI-Draw-IO 基于 Next.js 构建前端，内嵌 draw.io 编辑器作为图表渲染层，通过 LLM API 实现自然语言到图表的转换。其核心功能涵盖以下几个方面：
自然语言图表生成
用户在对话框中输入图表描述，AI 会自动生成对应的 draw.io XML 格式图表并渲染到画布上。例如：
- "画一个微服务架构图，包含 API Gateway、用户服务、订单服务和消息队列"
- "创建一个 CI/CD 流水线流程图，从代码提交到生产部署"
- "绘制一个 OAuth 2.0 授权码模式的时序图"
AI 不仅生成节点和连线，还会根据图表类型自动选择合适的布局（层级布局、环形布局、流程布局等），并应用恰当的样式和图标。生成后的图表可以在 draw.io 编辑器中自由调整，保留了 draw.io 全部的手动编辑能力。
图片复制与文档上传
除了文字描述，Next-AI-Draw-IO 还支持两种非文字输入方式：
- 图片复制：上传一张已有图表的截图，AI 会识别图中的结构并在 draw.io 中重建。这对于将白板照片、PDF 中的图表或其他工具导出的图片转化为可编辑格式非常实用。
- 文档上传：支持 PDF 和文本文件上传，AI 会从文档内容中提取关键信息并自动生成相关图表。比如上传一份 API 文档，可以自动生成接口调用关系图。
云架构图支持
对于云计算从业者来说，Next-AI-Draw-IO 内置了三大云平台的图标库和模板支持：
用户可以通过自然语言描述云架构，AI 会自动使用对应云平台的官方图标生成架构图。例如输入"画一个典型的 AWS 三层 Web 应用架构，包含 CloudFront、ALB、ECS、RDS 和 ElastiCache"，生成的图表会使用 AWS 官方图标，布局符合架构图的常见规范。Azure 云平台同样获得了完整的图标支持。
动画连接器
Next-AI-Draw-IO 的一个独特功能是支持动画连接器——图表中的连线可以显示数据流动方向的动画效果。这在演示数据管道、消息传递流程或网络拓扑时特别有用，让静态图表变得更加直观。
部署与安装
Next-AI-Draw-IO 提供了多种部署方式，从本地开发到生产部署都有对应方案。
Docker 五分钟部署
最快的方式是使用 Docker：
# 克隆仓库
git clone https://github.com/DayuanJiang/next-ai-draw-io.git
cd next-ai-draw-io
# 创建环境变量文件
cp .env.example .env
# 编辑 .env 填入 LLM API Key
# 启动容器
docker compose up -d
启动后访问 http://localhost:3000 即可使用。整个过程从拉取镜像到服务就绪通常不超过 5 分钟。
一键云部署
对于不想管理服务器的用户，项目支持：
- Vercel 一键部署：点击 Deploy 按钮，填入环境变量即可完成部署，适合个人使用和小团队
- 腾讯 EdgeOne Pages 部署：面向国内用户的边缘部署方案，访问速度更快
桌面应用
2026 年 3 月 7 日的更新带来了桌面应用支持，覆盖 Linux、macOS 和 Windows 三大平台。桌面版本封装了 Web 应用的全部功能，离线状态下仍可使用 draw.io 编辑器的手动编辑功能（AI 生成功能需要网络连接或本地 LLM）。
LLM 配置与模型选择
Next-AI-Draw-IO 支持多种 LLM 后端，用户可以根据需求和预算灵活选择：
- OpenAI：GPT-4o 系列，图表生成质量最佳，特别是复杂架构图
- Anthropic Claude：在理解长文档和生成结构化图表方面表现出色
- 本地模型：通过 Ollama 等本地推理框架接入，适合离线或隐私敏感场景
API Key 在 Web 界面中直接配置，存储在浏览器本地，不会上传到任何第三方服务器。对于自部署的实例，也可以通过环境变量预配置 API Key，让团队成员无需各自设置。
与传统绘图工具的对比
| 特性 | Next-AI-Draw-IO | draw.io 原版 | Mermaid | Excalidraw |
|---|---|---|---|---|
| AI 生成 | 自然语言 | 不支持 | 代码生成 | 不支持 |
| 云架构图标 | AWS/GCP/Azure | 支持 | 不支持 | 不支持 |
| 手动编辑 | 完整 draw.io | 完整 | 不支持 | 手绘风格 |
| 图片转图表 | 支持 | 不支持 | 不支持 | 不支持 |
| 动画效果 | 支持 | 有限 | 不支持 | 不支持 |
| 导出格式 | SVG/PNG/XML | SVG/PNG/XML | SVG/PNG | SVG/PNG |
| 自部署 | Docker/Vercel | 已有方案 | 无需部署 | Docker |
Next-AI-Draw-IO 的核心优势在于将 AI 生成能力与 draw.io 成熟的编辑器生态无缝结合——AI 负责快速生成初版，draw.io 负责精细调整，两者互补形成完整的工作流。
总结
Next-AI-Draw-IO 展示了 AI 与传统工具深度集成的范式：不是重新造一个 AI 原生绘图工具，而是为已经广泛使用的 draw.io 增加 AI 能力层。这种方式的好处是用户可以保留已有的 draw.io 使用习惯和模板资产，同时获得 AI 带来的效率提升。对于经常需要绘制架构图、流程图的技术团队，这个工具值得加入日常工具箱。五分钟的 Docker 部署门槛和灵活的 LLM 选择让上手成本极低，而完整的 draw.io 编辑能力则保证了在 AI 生成不完美时仍有手动调整的退路。
评论