news 2026/9/2 17:46:29

还在手搓流程图?DeepSeek+Draw.io王炸组合,一句话秒出可编辑源文件!

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
还在手搓流程图?DeepSeek+Draw.io王炸组合,一句话秒出可编辑源文件!

大家好,我是小肥肠!今天给大家分享一个一句话生成流程图的AI工具,支持在线编辑,使用方法也很简单,5分钟即可完成部署轻松上手,感兴趣就速速码住哦~

目录

1. 效果展示

2. 部署使用

2.1. docker安装

2.2. next-ai-draw-io安装

3. 结语

1. 效果展示

昨天剪辑AI漫剧的空隙刷了一下AI资讯(超绝不经意展示我在做的AI漫剧,嘻嘻)。

偶然发现了一个让我眼前一亮的项目—next-ai-draw-io。咱们的老粉应该记得,之前我分享过一篇让Mermaid听懂人话:用Coze空间+MCP一句话搞定所有业务图。那个方案虽然好用,但是有个缺点就是不能在线修改,而今天这个工具,直接把AI嵌入到了我们最熟悉的 draw.io 里!

以前上班画架构图、流程图,draw.io 是绝对的T0级别工具,现在加上了 AI 的加持,简直是如虎添翼。我花了5分钟在本地部署了一套,接入了 DeepSeek 模型,效果直接炸裂:一句话生成规范流程图,不满意还能直接在右侧 UI 界面手动微调。

首先是流程图:

帮我画一个电商用户的购物流程图。从用户浏览商品开始,包括加入购物车、结账、支付成功/失败的判断,一直到发货和确认收货

又试了一下带动态效果的架构图:

我画一个简单的网络架构图,包含一个‘客户端’图标和一个‘服务器’图标。请使用带有明显动画效果的连接线(animated connector)将它们连接起来,方向从客户端指向服务器,生动地展示数据正在传输的过程。

生成的流程图经过修改后,可以直接将源文件下载到本地使用。话不多说直接教大家来部署使用,结尾还送小肥肠配置好的next-ai-draw-io压缩包,大家可以直接拿过去部署使用~

2. 部署使用

2.1. docker安装

1.安装 WSL 2(适用于 Windows 10 版本 2004 及以上):

Windows 子系统 Linux 2(WSL 2)提供了一个完整的 Linux 内核,Docker Desktop 依赖于此。win+R打开命令窗口,输入winver查看系统版本,确保内部版本高于19041:

以管理员身份打开 PowerShell,运行以下命令:

wsl --install

安装完成后需要重启一下计算机。

2.安装DockerDesktop

安装 Docker Desktop 之前,确保你已经安装并启用了 WSL 2。可以通过在PowerShell运行以下命令来检查:

wsl --list --verbose

下载 Docker Desktop:访问 Docker 官方网站,下载适用于 Windows 的 Docker Desktop 安装包。

安装 Docker Desktop

  • 双击下载的安装文件Docker Desktop Installer.exe
  • 按照提示完成安装过程。
  • 安装完成后,系统可能提示重启计算机,建议重启以确保所有组件正常工作。

启动 Docker Desktop:电脑重启后,启动Docker Desktop,初次启动可能需要一些时间。

配置一下docker镜像源地址:

以下镜像源地址为国内地址,你不想用我的也可以自己找:

{ "builder": { "gc": { "defaultKeepStorage": "20GB", "enabled": true } }, "experimental": false, "registry-mirrors": [ "https://docker.1panel.live", "https://hub.rat.dev", "https://docker.chenby.cn", "https://docker.m.daocloud.io" ] }

2.2. next-ai-draw-io安装

来到next-ai-draw-io仓库页面https://github.com/DayuanJiang/next-ai-draw-io点击下载压缩包按钮。

将下载好的压缩包解压到任意目录,如有git可以用git clone命令直接下载项目到文件夹中:

git clone https://github.com/DayuanJiang/next-ai-draw-io

复制一份env.example文件并改名为.env。

在.env文件中进行大模型配置用来驱动drawio绘图操作,下图中我配置的是deepseek,你也可以配置其他模型:

打开docker-compose.ym文件在进行如下配置:

注意:为了防止和本地其他服务冲突,我将 drawio 的端口修改为了 8818。如果你本地 8080 没被占用,保持默认即可;如果占用了,记得像我截图里一样,同时修改portsenv文件里的端口号。

回到next-ai-draw-io文件目录,在文件路径处输入cmd打开命令提示符,输入命令docker-compose up -d --build

等待next-ai-draw-io安装,成功后打开网址http://localhost:3000/zh即可进入next-ai-draw-io操作界面,我们可以开始进行一句话生成流程图的操作了:

以上就是本期教程的完整内容,想获取小肥肠已经配置好的next-ai-draw-io压缩包可以评论区说流程图哦~

3. 结语

无论你是产品经理、开发人员还是架构师,这套DeepSeek + next-ai-draw-io的组合,绝对能成为提高工作效率的一把利器。

如本次分享对你有帮助,麻烦一键三连支持一下小肥肠,我们下期再见~

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/8/29 12:18:23

数学公式识别挑战:HunyuanOCR对LaTeX符号的支持程度

数学公式识别挑战:HunyuanOCR对LaTeX符号的支持程度 在智能文档处理日益普及的今天,用户不再满足于“把图片变文字”这种基础能力。科研人员希望一键提取论文中的复杂公式,教师期待自动解析试卷内容用于题库建设,而学生则渴望通过…

作者头像 李华
网站建设 2026/9/1 15:48:02

社交媒体图像内容审核:HunyuanOCR识别违规文本信息

社交媒体图像内容审核:HunyuanOCR识别违规文本信息 在短视频平台的一次日常巡查中,审核系统突然拦截了一条看似普通的“兼职返利”动态——图片是一张设计粗糙的微信聊天截图,文字歪斜、背景模糊。传统OCR工具在此类低质量图像上常会漏检关键…

作者头像 李华
网站建设 2026/8/29 3:14:59

TypeScript类型定义补充:为HunyuanOCR API编写interface

TypeScript类型定义补充:为HunyuanOCR API编写interface 在现代AI应用开发中,一个强大的OCR模型如果缺乏清晰的接口契约,其落地效率往往会大打折扣。腾讯推出的HunyuanOCR作为一款基于原生多模态架构的端到端轻量级OCR专家模型,仅…

作者头像 李华
网站建设 2026/8/26 21:05:06

树莓派红外发射控制实践:编码发送完整示例

树莓派玩转红外遥控:从零实现空调、电视的智能控制你有没有过这样的经历?家里的老款空调没有联网功能,夏天回家前没法提前开机;客厅的电视遥控器总是“失踪”,翻沙发都找不到。其实,这些问题都可以通过一块…

作者头像 李华
网站建设 2026/8/22 7:50:50

GitHub镜像网站加速HunyuanOCR下载的方法汇总

GitHub镜像加速部署HunyuanOCR的实践指南 在AI技术快速落地的今天,一个看似简单的OCR功能背后,往往隐藏着复杂的模型架构与部署挑战。尤其是当开发者试图在国内网络环境下拉取海外开源项目时,GitHub访问缓慢、模型文件下载超时等问题几乎成了…

作者头像 李华
网站建设 2026/8/28 4:40:54

SHA256校验码在哪里获取?防止下载到篡改版本

SHA256校验码在哪里获取?防止下载到篡改版本 在AI模型加速落地的今天,一个看似不起眼的技术细节——文件校验,正在悄然决定着整个系统的可信边界。想象一下:你正准备部署“腾讯混元OCR”用于发票识别,流程走完却发现身…

作者头像 李华