Smart Excalidraw：用自然语言绘制专业图表的 AI 绘图工具

本文介绍 Smart Excalidraw，一个基于 AI 的智能绘图工具，通过自然语言描述即可自动生成专业的 Excalidraw 图表。

项目简介

Smart Excalidraw 是一个开源的智能绘图平台，它将大语言模型的能力与 Excalidraw 的手绘风格图表完美结合。用户只需用自然语言描述需求，即可生成结构清晰、布局合理的专业级图表。

该项目基于 Next.js 16 和 React 19 构建，集成了先进的 AI 模型，让绘图变得简单高效。无论是流程图、架构图还是思维导图，都能通过一句话描述快速生成。

核心特性

AI 驱动绘图

通过先进的大语言模型理解用户需求
自动生成结构清晰、布局合理的专业级图表
支持多种 AI 提供商（OpenAI、Anthropic）

独创连接算法

智能箭头优化算法
自动计算最佳连接点
告别混乱的线条交叉

丰富图表类型

支持 20+ 种图表类型
流程图、架构图、时序图
ER 图、思维导图等

Excalidraw 集成

生成的图表完全基于 Excalidraw 格式
可自由编辑、调整样式
支持导出和分享

开箱即用

只需配置一个 AI API 密钥即可开始使用
支持访问密码模式
无需复杂设置

技术栈

Next.js 16 - React 框架
React 19 - UI 库
Excalidraw - 手绘风格图表库
Tailwind CSS 4 - 样式框架
Monaco Editor - 代码编辑器

安装指南

本地部署

bash

# 克隆仓库
git clone https://github.com/liujuntao123/smart-excalidraw-next.git
cd smart-excalidraw-next

# 安装依赖
pnpm install

# 启动开发服务器
pnpm dev

配置 AI

点击「配置 LLM」按钮
选择提供商（OpenAI 或 Anthropic）
填入 API Key（推荐使用 Claude Sonnet 4.5）
保存配置

访问密码模式

点击「访问密码」按钮
输入管理员提供的密码
验证并启用

使用示例

生成流程图

输入：「创建一个用户注册流程图，包含邮箱验证和手机验证两个分支」

生成架构图

输入：「设计一个微服务架构图，包含网关、认证服务、用户服务、订单服务和数据库」

生成思维导图

输入：「创建一个关于 React 学习路线的思维导图，包含基础、进阶和实战三个部分」

生成时序图

输入：「绘制一个电商下单流程的时序图，包含用户、前端、订单服务、支付服务和库存服务」

项目链接

GitHub 仓库：https://github.com/liujuntao123/smart-excalidraw-next
在线演示：https://ai-draw-nexus.aizhi.site
新版本地址：https://github.com/liujuntao123/ai-draw-nexus
许可证：MIT License