机器翻译正文由机器翻译自项目原始文档（英文），排版经程序统一处理，可能存在偏差，请以原项目仓库为准。

https://github.com/user-attachments/assets/66b9f12f-219f-4d62-acc0-0725e6850eec

用一句话描述想要的图，AI 就在真正的 draw.io 画布上把它画出来。你可以像编辑任何 draw.io 文件一样手动修改，也可以选中几个图形、告诉 AI 要改什么。AI 的每次修改都是一个版本，可以对比、恢复或撤销；结果可以导出为 .drawio、.png 或 .svg。

提供网页版、Windows / macOS / Linux 桌面版，以及供 Claude Code、Cursor、VS Code 等 AI 代理调用的 MCP 服务器。

亮点

画

• 一句话生成架构图、流程图、时序图等，内置 AWS、Azure、GCP、Kubernetes 等图标库
• 连接线可以带流动动画
• 上传截图或手绘图，让 AI 照着画；上传 PDF、Markdown、代码等文本文件，从内容生成图

改

• 用对话修改：改动流式呈现，刚改过的图形在画布上高亮
• 选中图形提问：在画布上选中几个图形，AI 只改这几个
• 版本与撤销：每次 AI 修改都是一张带缩略图的版本卡片，可以和画布对比、恢复、撤销；画布上按 Ctrl+Z 也能一步撤回 AI 的修改
• 它就是普通的 draw.io：双击改名、拖动、调样式、多页，随时导出 .drawio、.png、.svg、.drawio.svg

用

• 支持 24 家模型服务商，可以在浏览器里填自己的 API Key，Key 只保存在本地
• 支持推理的模型会显示思考过程
• 深色模式；界面有英文、简体中文、繁体中文、日文

示例

更多示例，以及每张图的提示词和模型，见 图库。

使用方式

在线体验

打开 next-ai-drawio.jiang.jp 即可使用，无需安装。演示站有用量限制；点击聊天面板里的设置图标，填入自己的服务商和 API Key 就不受限制。Key 只保存在浏览器本地，不会上传到服务器。

桌面应用

在 Releases 页面 下载 Windows、macOS 或 Linux 安装包。

在 AI 代理里使用（MCP）

https://github.com/user-attachments/assets/6f53a67b-ab21-4113-9fee-7fb32f9de678

通过 MCP（Model Context Protocol，让 AI 代理调用外部工具的协议），Claude Desktop、Cursor、VS Code 等都能直接画 draw.io 图。在客户端的 MCP 配置里加上：

{
  "mcpServers": {
    "drawio": {
      "command": "npx",
      "args": ["@next-ai-drawio/mcp-server@latest"]
    }
  }
}

VS Code 和 Cursor 点一下就能装好：

Claude Code 用一行命令（--scope user 让所有项目都能用）：

claude mcp add --scope user drawio -- npx @next-ai-drawio/mcp-server@latest

它也是 Claude Code 社区插件市场里的一个插件（需要 Claude Code 2.1.275 或更高版本）：

/plugin install next-ai-drawio --marketplace anthropics/claude-plugins-community

然后对 AI 说"画一个用户认证流程图，包含登录、MFA 和会话管理"，图会实时出现在浏览器里。MCP 服务器包含网页版的大部分画图能力：

• 与网页版相同的画图规则、图标库（AWS、Azure、GCP、Kubernetes 等）和画布：AI 的改动会被标出，按一次 Ctrl+Z 就能撤销，AI 还能读到你选中的图形
• 截图工具，AI 可以看一眼画好的图并自行修正
• 版本历史、多页图表，导出为 .drawio、.png、.svg 或 .drawio.svg，并自动保存到 ~/.next-ai-drawio/；draw.io 编辑器随包安装，预览不需要联网

Codex、VS Code、Cursor 等客户端的配置、全部工具，以及和其他 draw.io MCP 服务器的对比，见 MCP 服务器页面。

和 draw.io 自带的 AI 有什么不同

draw.io 自带 Generate 工具（Arrange > Insert > Generate）。它在 draw.io 里运行，可以用免费的托管模型，也可以填自己的 API key；把图、页面或选中的图形附加到对话里，它就能修改。Next AI Draw.io 每条消息都会带上当前画布，包括你手动做的修改；AI 的每次修改都是一个可以对比或恢复的版本；支持 25 家模型服务商，包括通过 Ollama 使用本地模型，在演示站、桌面应用和自己的服务器上都能用。

自己部署

本地运行

git clone https://github.com/DayuanJiang/next-ai-draw-io
cd next-ai-draw-io
npm install
cp env.example .env.local   # 填入服务商和 API Key，见下文"模型与服务商"
npm run dev

打开 http://localhost:6002。

一键部署

模型与服务商

支持 AWS Bedrock（默认）、OpenAI、Anthropic、Google AI、Google Vertex AI、Azure OpenAI、Ollama、OpenRouter、AIHubMix、DeepSeek、SiliconFlow、SGLang、Vercel AI Gateway、腾讯云 EdgeOne、字节跳动豆包、ModelScope、智谱 GLM、通义千问、七牛云、Kimi、MiniMax、Novita、小米 MiMo、Atlas Cloud，以及一个可填任意地址的 OpenAI 兼容预设（vLLM、LM Studio、网关），共 25 家。各家的环境变量和注意事项见服务商配置指南。

选哪个模型：这项任务要生成格式严格的长文本（draw.io XML），请选能力较强的模型，小模型容易画出错误的图。

多模型与管理面板：在 AI_MODEL 里用逗号列出多个模型 ID，或用 AI_MODELS_CONFIG 环境变量 / ai-models.json 文件配置多家服务商的模型，所有用户无需自带 Key 即可使用。设置 ADMIN_PASSWORD 后访问 /admin，可以在网页里管理模型、访问码、功能开关、可观测性和配额，见管理面板指南。

支持

• 问题和建议：提交 GitHub Issue，或发邮件到 me[at]jiang.jp
• 常见问题：FAQ
• 如果这个项目对你有用，欢迎赞助，帮助我维持演示站点的运行