做开发、产品、运营的小伙伴，谁没被画图折磨过？
想画个微服务架构图，对着 Draw.io 满屏按钮一脸懵；
产品手绘的业务流程图，要手动描成标准矢量图，一调就是半小时；
改图时手滑删了关键元素，找不回原版本只能重画……
要是能直接跟 AI 说一句
“画个电商下单流程图，包含下单、支付、发货、确认收货”
AI 就直接生成专业的 Draw.io 图，还能对话式改图，是不是想想都爽？
今天就给大家安利一个开源项目 ——next-ai-draw-io
一句话生专业的架构图表！
再也不用手动拖框了，说句话图就出来了
这绝对是最核心的功能，也是最颠覆的一点。
以前用draw.io，你得自己找图标、拖元素、对齐、连线，一个复杂点的架构图，没俩小时根本搞不定。
现在呢？你只要在左边的聊天框里，用大白话描述你的需求就行。
下面是官方的一些例子
它的底层技术，本质是把 AI 大模型和老牌专业绘图工具 draw.io 做了一次 “无缝嫁接”
它没有从零造一个画图引擎，而是利用 draw.io 原生的 XML 图表格式 —— 这种格式会精确记录每个图形的位置、样式、连接关系等信息 —— 让 AI 学会 “读懂并生成” 这段 XML 代码。
当你用自然语言描述 “画一个带数据库的用户注册流程图”，或是上传一张手绘架构图时，AI 会先理解你的业务逻辑和视觉需求，再输出符合 draw.io 规范的 XML 片段
最后通过 react-drawio 库把这段代码渲染成可拖拽、可编辑的可视化图表；
同时它用 Next.js 搭建前端界面保证流畅体验，通过 Vercel AI SDK 对接不同大模型，确保生成的图表稳定可用，甚至封装成可嵌入 VS Code、Cursor 等编辑器的 MCP 服务，让 “用对话画图” 变成开发和设计 workflow 里的顺手工具。
5 分钟上手，三种方式随便选
方式一：在线试用（零门槛，打开就用）
如果你只是想试试水，不用装任何东西，直接访问官方的演示站点就行：
方式二：Docker 一键部署（推荐，本地用最方便）
要是想长期用，或者担心数据安全，本地部署也超级简单，一条命令就行：
docker run -d -p 3000:3000 \
-e AI_PROVIDER=openai \
-e AI_MODEL=gpt-4o \
-e OPENAI_API_KEY=你的API Key \
ghcr.io/dayuanjiang/next-ai-draw-io:latest执行完之后，打开浏览器访问 http://localhost:3000 就能用了，不用折腾任何环境依赖，一键搞定。
方式三：源码部署（适合二次开发）
如果你想自己改改功能，或者做二次开发，也可以直接拉源码跑：
git clone https://github.com/DayuanJiang/next-ai-draw-io
cd next-ai-draw-io
npm install
cp env.example .env.local
# 编辑.env.local配置你的API信息
npm run dev启动之后访问 http://localhost:6002 就可以了。
项目地址：
