Next AI Draw.io
一个集成了AI功能的Next.js网页应用，与draw.io图表无缝结合。通过自然语言命令和AI辅助可视化来创建、修改和增强图表。
在Gtihub上已经斩获4.8k Star！
核心特性
LLM驱动的图表创建
利用大语言模型通过自然语言命令直接创建和操作draw.io图表
基于图像的图表复制
上传现有图表或图像，让AI自动复制和增强
图表历史记录
全面的版本控制，跟踪所有更改，允许您查看和恢复AI编辑前的图表版本
交互式聊天界面
与AI实时对话来完善您的图表
AWS架构图支持
专门支持生成AWS架构图
动画连接器
在图表元素之间创建动态动画连接器，实现更好的可视化效果
多提供商支持
-
AWS Bedrock（默认）
-
OpenAI
-
Anthropic
-
Google AI
-
Azure OpenAI
-
Ollama
-
OpenRouter
-
DeepSeek
-
SiliconFlow
本地安装
克隆仓库代码
git clone https://github.com/DayuanJiang/next-ai-draw-io
cd next-ai-draw-io
安装依赖
npm install
# 或
yarn install
配置AI提供商
在根目录创建.env.local文件：
cp env.example .env.local
-
将AI_PROVIDER设置为选择的提供商（bedrock, openai, anthropic, google, azure, ollama, openrouter, deepseek, siliconflow）
-
将AI_MODEL设置为要使用的特定模型
-
添加提供商所需的API密钥
-
TEMPERATURE：可选的温度设置（例如 0 表示确定性输出）。对于不支持此参数的模型（如推理模型），请不要设置。
-
ACCESS_CODE_LIST访问密码，可选，可以使用逗号隔开多个密码。
启动服务
npm run dev
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
浏览器访问
http://localhost:3000
使用
通过对话即可完成draw画布，下面看看测试效果，简直Amazing …
示例：画一个java应用分布式部署图
完成效果
如果对完成效果不满意，可以再次对话，指导修改，简直太恐怖了！
感兴趣的小伙伴快去试试吧！
开源地址
https://github.com/DayuanJiang/next-ai-draw-io
