[JS/TS] 基于LLM的图表工具Next AI Draw.io：自然语言对话生成架构图

Next AI Draw.io 是一个将大型语言模型（LLM）与专业绘图工具 draw.io 深度集成的 Web 应用。它允许开发者或架构师直接使用自然语言进行对话，从而快速创建、修改和优化各类图表，尤其擅长生成云架构图，极大地提升了技术可视化的效率。

核心功能 (Features)

• 自然语言创建图表：直接向 AI 描述你的想法（如“画一个包含负载均衡器、应用服务器和数据库的三层架构”），即可自动生成对应的 draw.io 图表。
• 图像/图表识别与增强：上传已有的图表截图或 draw.io 文件，AI 可以识别其中的元素并生成一个可编辑的副本，或根据你的要求进行优化。
• 文档内容提取：支持上传 PDF 或文本文件，AI 能够从中提取关键信息并转化为清晰的示意图。
• AI 思考过程可视化：当使用支持该功能的模型（如 OpenAI o1/o3、Claude、Gemini）时，可以查看模型生成图表时的完整推理链。
• 全面的版本历史：系统自动保存每一次 AI 编辑前的图表版本，方便随时查看对比和回退。
• 交互式聊天优化：在绘图过程中可随时与 AI 对话，持续对图表进行调整和细化。
• 云架构专项支持：内置对 AWS、GCP、Azure 等主流云厂商图标和架构范式的支持，简化云架构图绘制。
• 动画连接器：可以为图表中的连接线添加动画效果，使数据流或架构关系更加直观。

在线体验与部署方式

你可以直接访问 在线体验地址 立即试用。项目源码托管于 GitHub。

试用说明：

1. 演示站点为方便体验，默认使用了限制流量的模型。
2. 如需获得最佳效果（如使用 Claude Sonnet/Opus），建议在设置中配置“自带 API 密钥”（密钥仅本地存储）。
3. 对于长期或团队使用，推荐通过 Docker 或本地安装进行自托管部署。

使用 Docker 快速部署（推荐）

Docker 部署能完美解决环境依赖问题，是实现一键式运行的最佳实践。

1. 安装 Docker 环境

首先确保你的系统已安装 Docker 和 Docker Compose。

• Windows/macOS：直接下载并安装 Docker Desktop。
• Linux (以 Ubuntu 为例)，可通过以下命令安装：

  # 更新系统包
  sudo apt-get update
  # 安装依赖
  sudo apt-get install ca-certificates curl gnupg
  # 添加Docker官方GPG密钥
  curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo gpg --dearmor -o /usr/share/keyrings/docker-archive-keyring.gpg
  # 配置稳定版仓库
  echo "deb [arch=$(dpkg --print-architecture) signed-by=/usr/share/keyrings/docker-archive-keyring.gpg] https://download.docker.com/linux/ubuntu $(lsb_release -cs) stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null
  # 安装Docker引擎及Compose插件
  sudo apt-get update
  sudo apt-get install docker-ce docker-ce-cli containerd.io docker-compose-plugin
  # 启动Docker并设置开机自启
  sudo systemctl start docker
  sudo systemctl enable docker
  # 将当前用户加入docker组（操作后需退出终端重新登录）
  sudo usermod -aG docker $USER

2. 启动项目容器

克隆项目后，在根目录下执行以下命令。首次运行会自动拉取镜像并构建，可能需要几分钟。

docker compose up -d

3. 访问应用

部署成功后，在浏览器中访问 http://localhost:3000 即可。

• 端口冲突处理：如果 3000 端口被占用，可以修改项目根目录的 docker-compose.yml 文件，将 ports: - "3000:3000" 改为其他端口，例如 - "8080:3000"，然后重启容器，并通过 http://localhost:8080 访问。

该应用基于现代 前端框架/工程化 技术栈（Next.js 16.x, React 19.x）构建，并利用 人工智能 能力实现了对话式绘图的创新体验。通过 云原生/IaaS 领域的标准工具 Docker 进行封装，使得部署过程变得极其简单高效，方便开发者快速集成到自己的工作流中。