I've been working on AI Agents recently and noticed a common frustration: most AI diagramming tools generate static images (PNG/JPG). If the AI gets one detail wrong, you can't easily fix it—you have to regenerate the whole thing.
I wanted a tool that generates editable code and renders it interactively. So I built DeepDiagram.
It’s an open-source web platform that uses a Multi-Agent architecture. Instead of a single prompt trying to do everything, a Router analyzes your intent and directs it to a specialized agent (e.g., a Draw.io expert, a Data Visualization expert, or a Flowchart expert).
Demos
Mind Map & Data Charts (ECharts):
Draw.io Generation (XML based):
Mermaid Diagrams:
Tech Stack
Orchestration: LangGraph (Python) for the ReAct loop and state management.
Frontend: React 19, Vite, TailwindCSS, Zustand.
Backend: FastAPI (Python 3.10+).
Streaming: Uses SSE (Server-Sent Events) for real-time preview (typewriter effect).
Key Features
Draw.io Agent: Generates compatible XML. You can edit the result directly in the canvas.
Data Chart Agent: Paste raw data (CSV/JSON/Text), and it visualizes it using ECharts (Bar/Line/Pie).
Branching & Time Travel: Since AI isn't perfect, I implemented a Git-like branching system. You can "retry" a message, creating a new branch, or navigate back to previous states to see the agent's thought process.
Self-Hosted: Docker Compose support included. Works great with OpenAI or DeepSeek V3 (highly recommended for cost/performance).
I've been working on AI Agents recently and noticed a common frustration: most AI diagramming tools generate static images (PNG/JPG). If the AI gets one detail wrong, you can't easily fix it—you have to regenerate the whole thing.
I wanted a tool that generates editable code and renders it interactively. So I built DeepDiagram.
It’s an open-source web platform that uses a Multi-Agent architecture. Instead of a single prompt trying to do everything, a Router analyzes your intent and directs it to a specialized agent (e.g., a Draw.io expert, a Data Visualization expert, or a Flowchart expert).
Demos Mind Map & Data Charts (ECharts):
Draw.io Generation (XML based):
Mermaid Diagrams:
Tech Stack Orchestration: LangGraph (Python) for the ReAct loop and state management.
Frontend: React 19, Vite, TailwindCSS, Zustand.
Backend: FastAPI (Python 3.10+).
Streaming: Uses SSE (Server-Sent Events) for real-time preview (typewriter effect).
Rendering Engines: React Flow, Apache ECharts, Mermaid.js, and Draw.io (Atlas theme).
Key Features Draw.io Agent: Generates compatible XML. You can edit the result directly in the canvas.
Data Chart Agent: Paste raw data (CSV/JSON/Text), and it visualizes it using ECharts (Bar/Line/Pie).
Branching & Time Travel: Since AI isn't perfect, I implemented a Git-like branching system. You can "retry" a message, creating a new branch, or navigate back to previous states to see the agent's thought process.
Self-Hosted: Docker Compose support included. Works great with OpenAI or DeepSeek V3 (highly recommended for cost/performance).
Links GitHub (AGPL-3.0): https://github.com/twwch/DeepDiagram
It's still in the early stages, but I'd love to hear your feedback or see your PRs!