👋 背景
做开发的时候，画图一直是个痛点。Mermaid 画简单的还可以，但是稍微复杂点的架构图或者漂亮的数据报表，要么手写代码写到崩溃，要么就得去拖拉拽半天。
为了解决这个问题，我基于 LangGraph (多智能体编排) 和 React 19 (Server Components) 开发了 DeepDiagram。
它的核心理念是：让 AI 根据你的需求（文字/图片），自动把脏活累活干了，直接给你生成可用的代码。
🧠 核心架构：它是如何工作的？
不同于市面上简单的 Prompt 拼接，DeepDiagram 是一个完整的 Multi-Agent 系统：
- Router Agent： 识别用户意图（是想画架构图？还是分析数据？）。
- Specialist Agents： 分发给专门的绘图 Agent （ Drawio Agent, ECharts Agent, Flow Agent 等）。
- Code Generator： 输出对应的 DSL 或 JSON 配置，并在前端渲染。
(效果演示：AI 路由分发任务)
✨ 三大核心绘图能力
为了满足不同场景，我集成了三种最常用的工程化绘图标准：
1. 复杂架构图 (Draw.io / Atlas)
- 场景： 云资源图、UML 、系统架构设计。
- 特点： 生成的不是死图，而是标准的 Draw.io XML ，支持二次编辑，复刻专业工具体验。
2. 数据可视化 (ECharts AI)
- 场景： 运营报表、数据分析。
- 特点： 扔给 AI 一段 JSON 或 Excel 数据，自动分析字段含义，生成高颜值的 ECharts 图表代码。
3. 流程与时序 (Mermaid & React Flow)
- 场景： 快速逻辑梳理。
- 特点： 支持标准 Mermaid 语法，同时对于交互要求高的场景，支持生成基于 React Flow 的节点图。
📸 亮点功能：草图转代码 (Sketch-to-Code)
这是我觉得最好用的功能。开会时白板上画的乱七八糟的逻辑图，拍张照上传，Agent 会自动识别节点关系，直接重绘成清晰的电子图表。
💻 技术栈 (Tech Stack)
项目完全开源，如果你对当下流行的 Agent 应用开发 感兴趣，欢迎参考：
- Frontend: React 19, TailwindCSS, ShadcnUI
- LLM Orchestration: LangGraph, LangChain
- Backend: FastAPI, PostgreSQL
- Deployment: Docker Compose (一键部署，数据掌握在自己手里)
🔗 传送门
目前还在快速迭代中，欢迎F友们试用反馈，觉得不错请给个 Star ⭐️ 支持一下！
GitHub 地址： https://github.com/twwch/DeepDiagram
| 
