draw.io 接上大模型之后,我发现现在画图效率提升了 1000%,谁用谁爱用

大模型容器智能体验与创作

picture.image

如果你平时要画流程图或者系统架构图或者产品原型,大概率都被 draw.io 或者类似工具折磨过。
打开一个空白画布,拖方块拉箭头调对齐,画到后面你已经分不清自己是在整理逻辑,还是在给软件打工。

最尴尬的是改动。
一个字段名字改了,一个环节被推翻,你往往要跟着重画半张图,线一多,想保持整洁基本就是折磨自己。

next-ai-draw-io 这个项目做了一件很直白的事。
它把 draw.io 包了进去,前面套了一个聊天界面,你只负责说人话,它负责把人话翻译成标准的 draw.io XML 图,然后直接在页面里渲染出来。


现在画图是在和一个专家在说话

最核心的一点,它是正儿八经用大模型去生成 draw.io 图的底层 XML,而不是简单吐个图片给你看一眼。
这意味着你生成完的图,可以像平时用 diagrams.net 一样,继续随意拖动和微调,不会因为是 AI 生成的就变成“死图”。

你用起来的体验,大概是这样的节奏。
你打开网页,看到一个聊天框和一个嵌在旁边的 draw.io 画布,然后直接跟它说,帮我画一个用户注册登录流程,把邮箱验证和密码找回都加上。
它会在后面调用你配置好的大模型,生成一段 draw.io XML,画布几秒钟就长出一张完整的流程图。

如果你对某个细节不满意,比如想把重置密码那一支拆得再细一点,继续在聊天里说你想怎么拆,它会对现有图做增量修改,而不是重头来一次。
这时候你会明显感觉到,自己在编辑的是“概念”,而不是线条和方块本身。


用几个具体场景看它的价值

光说抽象功能没什么意思,案例如下。

其一,拿来复制现有图。
你可以把一张已有的架构图或者流程图上传上去,让它帮你照着重画,甚至顺手帮你做一点清理和规范,类似把这一堆手动画的图洗一洗,变成统一风格。

picture.image

看我把上面的图变成中文的

其二,让文档自动长出流程图。
这个项目支持上传 PDF 和文本文件,它会把内容抽出来,再生成对应的图,你不用再对着需求文档一点点手画流程。
对于那种几十页的系统方案,这一刀砍下去,你节省的是几个小时连轴转的脑力劳动。

其三,更专业一点的云架构图。
它内置了对 AWS 和 GCP 和 Azure 架构图的支持,生成的图可以自动带对应云厂商的图标,而不是简单用矩形代替服务器和数据库。
如果你本来就要画云上拓扑,用它可以瞬间出一版比较体面的底稿,再自己微调。


这工具本身也挺讲究底层结构

从技术上看,它用的是 Next.js 做前端和路由,用 Vercel AI SDK 去适配各种模型服务,draw.io 的部分是通过 react-drawio 来嵌入和操作 XML 图。
你在聊天里说的每句话,最后要落地成一大段严格格式的 XML,所以对模型要求不低。

作者直接在文档里写了推荐模型,Claude Sonnet 4.5 和 GPT‑5.1 以及 Gemini 3 Pro 加上 DeepSeek V3.2 或 R1 这一类,原因也说得很直白,这个任务对结构化输出要求高,模型如果经常少标签或者乱嵌套,图就会挂掉。
还有一个细节,Claude 系列因为训练时看过不少带 AWS 和 Azure 和 GCP 等 Logo 的架构图,所以在画云架构场景下的表现会更稳一点,这种信息一般只有亲手踩过坑的人才会写进文档里。

这个项目也没有绑死某一家。
你可以选 AWS Bedrock 和 OpenAI 以及 Anthropic 和 Google AI 以及 Azure OpenAI 和 Ollama 和 OpenRouter 和 DeepSeek 和 SiliconFlow 这些不同提供方,大部分还支持自定义 endpoint,对国内用户算比较友好。


真要自己搭起来门槛其实不高

如果你只是想体验一下,作者已经给了一个线上 Demo,可以直接打开网页玩,只不过因为流量不小,默认用的是 minimax-m2,效果一般属于够用但不惊喜的水平。
更稳的用法,是自己带一个 API Key 去玩,在设置里填上之后,请求就走你自己的账号,这样就不会被公共限额卡住。

要彻底自己掌控,最直接的办法是 Docker 起一个服务。


 
 
 
 
   
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

它已经打好了镜像,你本地装好 Docker,跑一条命令就能在 3000 端口开起来,只要在环境变量里给好 AI_PROVIDERAI_MODEL 以及对应的 API Key 就行。
如果你有多套环境,在项目里还有一个 env.example,可以复制成 .env 文件,把所有配置写完整,Docker 启动时直接用这个配置文件加载。

另外有一个小细节,它支持离线部署。
如果你所在网络下 diagrams.net 的在线资源域名被挡住了,可以按 Offline Deployment 文档,把底层 draw.io 改成访问你自己托管的版本,整个系统就更像一个封闭园区里的内部工具。


做得像产品而不是单纯 demo

很多开源 AI 小工具停在能跑通的阶段,这个项目的细节会多一点。
它给图表做了版本历史,你每次跟 AI 对话修改图,它都会存一版,你可以随时回到某个历史节点,这对那种改着改着改废了的情况非常有用。

它还能展示模型的思考过程。
如果你用的是支持展示 reasoning 的模型,比如一些带推理标签的家族,你可以看到它怎么拆解你的需求,一步步构思图的结构,这对调试提示词和理解模型行为都很方便。
再加上在线 Demo 和 Docker 模板以及 Vercel 部署按钮加上详细的多模型配置文档,这套东西已经远远超出了玩具,更像一个可以进团队日常工作流的工具。

从社区侧看,它是 Apache 2.0 协议,Star 已经破万,最近还在频繁更新,包括安全补丁和 Docker 支持以及 AWS App Runner 这种云上部署优化,维护活跃度算是比较健康的那一档。


这个项目有可能掀起的变化

如果你习惯了先写字后画图,你会发现这工具非常贴你的脑回路。
写完一段需求说明,顺手丢给它,让它先画一个初版逻辑图,你再往上叠细节,这种工作方式比传统先拖方块后连线要省心得多。

流程图和架构图原本是结构化表达的一部分,现在只是把结构化任务交给模型,人自己保留审稿权和微调权。
当这种工具变成默认选项之后,真正的门槛会从画得整不整齐,变成你有没有想清楚这件事本身。

所以,如果你日常离不开 draw.io,可以找个周末把 next-ai-draw-io 跑起来,先让它帮你重画一两张旧图。
你大概率会发现,自己真正需要花时间的地方,已经不在拖拉拽这些操作上了。

传送门 :next-ai-draw-io[1]

引用链接

[1] next-ai-draw-io: https://github.com/DayuanJiang/next-ai-draw-io

0
0
0
0
关于作者
关于作者

文章

0

获赞

0

收藏

0

相关资源
在火山引擎云搜索服务上构建混合搜索的设计与实现
本次演讲将重点介绍字节跳动在混合搜索领域的探索,并探讨如何在多模态数据场景下进行海量数据搜索。
相关产品
评论
未登录
看完啦,登录分享一下感受吧~
暂无评论