在 GitHub 上逛的时候，发现一个叫 next-ai-draw-io 的项目，刚开源没多久就挺火的。
这项目解决了一个挺具体的痛点：很多人想画专业的技术架构图，但要么不会用复杂的绘图工具，要么画起来太费时间。它直接用 AI 帮你把文字描述变成可编辑的 draw.io 图表
对经常需要画云架构图、流程图，但又不想折腾 Visio 或手动拖拽的工程师来说，这就像有个懂技术的助手在旁边，你说，它来画
next-ai-draw-io 是什么
一个基于 Next.js 的 Web 应用，核心是把 AI 大语言模型和 draw.io 这个老牌绘图工具结合在了一起。你不用学 draw.io 的复杂操作，直接跟 AI 聊天，说“画个 AWS 的三层架构图”或者“把这两个服务用箭头连起来”，它就能理解并生成或修改对应的图表 XML，在网页里实时渲染出来。
开源成就
-
Star数 GitHub 上已经吸引了 10.9k 星 
-
主开发语言 主要由TypeScript开发
核心功能
说话就能画图
这是最直接的功能，你打开网页，在聊天框里输入自然语言，比如“画个可爱的猫咪”，或者更专业的“展示 GCP 里 Cloud Run 连接到 BigQuery 的架构”。背后的 AI 模型会尝试理解你的意图，并生成一份 draw.io 能识别的 XML 代码，图表立刻就出来了。整个过程很像在描述需求，然后一个看不见的助手在帮你操作软件。
上传图片或 PDF 来还原
有时候你手头只有一张现成的草图或者技术文档的截图，手动重画太麻烦。这个工具允许你直接上传图片或者 PDF 文件，AI 会尝试识别里面的图形和文字逻辑，然后生成一个类似的、可编辑的 draw.io 图表文件。
完整的修改历史
跟 AI 来回沟通修改图表时，最怕就是改乱了回不去。项目里内置了一个版本历史功能，每一次 AI 对图表做出的修改都会被记录下来，形成一个时间线。你可以随时点开之前的任何一个版本预览，并且一键恢复，这比手动“撤销”要可靠得多，尤其适合那种需要尝试多种设计方案的情况。
云厂商图标库支持
画技术架构图，图标对不对味很重要。项目特别优化了对 AWS、GCP、Azure 这几家云厂商图标库的支持，你只需要在提示词里提到“用 AWS 图标”，AI 生成图表时就会自动调用那些官方风格的图标素材，不用自己再去一个个找和拖拽，最终的成图看起来就很专业。
看到 AI 的思考过程
如果你用的是 OpenAI 的 o1/o3、Claude 或者 Gemini 这类支持“思维链”输出的模型，在生成图表的过程中，你不仅能等到最终结果，还可以在旁边看到一个“推理”窗口。里面会逐步显示 AI 是如何分析你的指令、如何规划图表结构、为何选择某个元素的，这对理解 AI 的工作方式，或者调整你的指令都挺有帮助。
用 Docker 一键跑起来
项目的部署考虑得很周到，官方最推荐的方式就是用 Docker。你只需要在电脑上装好 Docker，复制一行命令，填上自己的 API 密钥，执行后就能在本地跑起来整个应用。这种打包方式避免了自己去配 Node 环境、解决依赖冲突的麻烦，对于想快速体验或者在内网部署的用户来说，非常友好。
docker run -d -p 3000:3000 \
-e AI_PROVIDER=openai \
-e AI_MODEL=gpt-4o \
-e OPENAI_API_KEY=your_api_key \
ghcr.io/dayuanjiang/next-ai-draw-io:latest
安装指南
-
最快体验方法
如果你只是想试试，作者提供了一个在线的演示站点，打开就能用，不需要安装任何东西。不过演示站因为流量大，用的 AI 模型可能不是最强的，你也可以在站点的设置里填入自己的 API 密钥来获得更好的效果。 -
本地 Docker 运行
这是最推荐的方式。确保电脑安装了 Docker，然后打开终端，执行类似docker run -p 3000:3000 -e OPENAI_API_KEY=你的密钥 ...这样的命令就行了。你也可以先下载项目里的env.example文件，改名为.env并在里面配置好 AI 提供商和密钥，然后用--env-file参数让 Docker 读取，管理起来更清晰。
开源地址https://github.com/DayuanJiang/next-ai-draw-io
近期热文:
|
|