DrawIO2Go

AI-Powered, Human-AI Collaboration

A modern DrawIO editor application dedicated to building better human-AI collaborative modeling tools with AI assistance. User-centered, enhancing human-machine efficiency, exploring how to best complement each other with AI. Provides out-of-the-box applications (Windows/Linux/Mac OS) or deployment as a web page.

https://github.com/user-attachments/assets/40fe5c3b-0f37-4fbf-b6ac-60b8734f2d14

Here are some actual demos and their prompts:

Quick Start

Using Electron APP

Go to Releases to download and install the latest version

Deploy as Web Application

Requirements:

• Node.js 22.x or higher
• npm

Then run the following commands

# Clone the repository
git clone https://github.com/your-username/drawio2go.git
cd drawio2go

# Install dependencies
npm install

Web Mode (Browser):

npm run dev

Open http://localhost:3000 in your browser

[!IMPORTANT] Please note that multi-user web deployment is not yet adapted (although theoretically there should be no issues, it has not been tested)

Known Issues

• [x] In web version, conversations may not be cancellable
• [x] Some specific errors from drawio tools cannot be captured currently
• [x] Conversation saving currently has some issues, may cause historical conversation loading exceptions
• [x] Some UI display issues exist

Upcoming Features

• [x] Support for passing selected elements from canvas to AI in Electron
• [x] Multi-page drawio support
• [ ] Full image/file conversation support
• [x] Support for custom DrawIO widget URL
• [x] Direct export to png/svg
• [x] Add more LLM API support
• [ ] Support for exporting projects to files
• [ ] Vision render review
• [ ] Support headless mode

Project Structure

drawio2go/
├── app/                    # Next.js App Router
│   ├── components/         # React components
│   │   ├── chat/          # AI chat module
│   │   ├── settings/      # Settings panels
│   │   ├── version/       # Version management
│   │   └── toast/         # Notification system
│   ├── lib/               # Utilities & services
│   │   └── storage/       # Unified storage layer
│   ├── hooks/             # React hooks
│   ├── i18n/              # Internationalization
│   ├── api/               # API routes
│   └── styles/            # CSS modules
├── electron/              # Electron main process
└── server.js              # Next.js custom HTTP server

Development Guide

Common Commands

npm run dev          # Start development server
npm run build        # Build for production
npm run lint         # Run ESLint + TypeScript check + complexity check
npm run test         # Run tests
npm run format       # Format code with Prettier

Production Build

# Build Next.js application
npm run build

# Build Electron