你好，我是小小金！今天又发现了一个超好玩的项目，分享一下。
你是否经历过这样的痛苦：脑子里已经有了清晰的系统架构，但打开 Draw.io 时，却要花费半小时去拖拽方框、调整对齐、一根根连线？
Next-AI-Draw-io 就是为了终结这种“体力活”而生的。它是一个基于 Next.js 开发的开源网页应用，巧妙地将 LLM（大语言模型） 与 Draw.io 无缝集成。
简单来说，你只需要像和 ChatGPT 聊天一样描述你的需求，它就能直接为你生成可编辑的 Draw.io 图表。
无需手动操作，直接输入：“帮我画一个电商系统的架构图，包含用户服务、订单服务和支付网关”。
完美支持 AWS、GCP、Azure 图标库。例如输入“使用 AWS 图标生成一个架构图，用户通过 CloudFront 访问...”，它能自动调用专业图标进行排版。
不仅能画静态图，还能通过指令生成带有动画效果的连接线（Flow Animation），让你的演示更加生动。
还有一个非常炸裂的功能：识图重绘。
开完会，把白板上潦草的架构草图拍下来上传，AI 能识别并将其转换为标准的 Draw.io 电子图。或者，看到技术博客里不错的架构图，截图上传，AI 帮你“复刻”一份可编辑的版本。
生成的图不满意？比如“框内的文字重叠了”或“把背景换成深色”，直接告诉 AI，它会精准修改 XML 代码，而不是重新生成一张新图。
整个项目的技术栈如下：
-
前端：Next.js + React -
AI 核心：Vercel AI SDK -
图表引擎：react-drawio (底层生成 XML) -
多模型支持：支持 OpenAI, Anthropic (Claude), Google Gemini, Azure，甚至支持通过 Ollama 运行本地模型（DeepSeek 等），保护你的架构隐私。
虽然市面上有很多 AI 画图工具（如 Mermaid），但它们大多生成的是“死图”或简单的流程图。
Next-AI-Draw-io 的最大优势在于：它生成的产物是标准的 Draw.io XML。 这意味着 AI 生成的只是一个“底稿”，你完全可以在此基础上，利用 Draw.io 强大的编辑器进行二次精修。它完美地在“AI 自动化”和“人工精细控制”之间找到了平衡点。
项目地址： https://github.com/DayuanJiang/next-ai-draw-io
「Github 掘金计划」由三名热爱开源的小伙伴利用业余时间共同维护
分享优质开源项目，欢迎关注👇
👉最近推荐的开源项目：