dayuanjiang/next-ai-draw-io

Developer tools

このページは AI により自動翻訳されています。技術的な詳細は原文をご確認ください。原文を見る

3.6万 stars 3813 forks 品質 96 トレンド 74Apache-2.0

Repository Install

AIとチャットして draw.io 図を描き、編集できます。ウェブアプリ、デスクトップアプリ、そしてClaude Code、Cursor、Codex、VS Code用のMCPサーバー。

概要

https://github.com/user-attachments/assets/66b9f12f-219f-4d62-acc0-0725e6850eec 図を文で説明すると、AIが実際の draw.io キャンバスに描きます。draw.io ファイルのように手で編集するか、いくつかの図形を選択してAIに何を変えるか指示してください。すべてのAI変更は比較、復元、元に戻すためのバージョンで、結果は.drawio、.png、.svgとしてエクスポートされます。ウェブアプリ、Windows、macOS、Linux向けのデスクトップアプリ、そしてClaude Code、Cursor、VS CodeなどのAIエージェント向けのMCPサーバーとして利用可能です。

概要（AI 翻訳）

AIとチャットして draw.io 図を描き、編集できます。

英語 |中文 |日本語

ライブデモドキュメントギャラリーデスクトップアプリ****MCPサーバー**

https://github.com/user-attachments/assets/66b9f12f-219f-4d62-acc0-0725e6850eec

図を文で説明すると、AIが実際の draw.io キャンバスに描きます。draw.io ファイルのように手で編集するか、いくつかの図形を選択してAIに何を変えるか指示してください。すべてのAI変更は比較、復元、元に戻せるバージョンで、結果は.drawio、.png、.svg]としてエクスポートされます。

ウェブアプリ、Windows、macOS、Linux向けのデスクトップアプリ、そしてClaude Code、Cursor、VS CodeなどのAIエージェント向けのMCPサーバーとして利用可能です。

ハイライト

引き抜け

AWS、Azure、GCP、Kubernetesのアイコンライブラリを内蔵し、一文からアーキテクチャ図、フローチャート、シーケンス図などをまとめられます
コネクターがフローイングアニメーションを搭載可能
スクリーンショットやスケッチをアップロードすると、AIがそれを描き直す;PDF、Markdown、コードやその他のテキストファイルをアップロードし、内容の図を取得

編集

チャットによる編集:変更がキャンバスに流れ込み、AIが変えた形状がハイライトされます

このページは AI により自動翻訳されています。技術的な詳細は原文をご確認ください。

README

以下は原文 README の抜粋です。原文を見る。

https://github.com/user-attachments/assets/66b9f12f-219f-4d62-acc0-0725e6850eec

Describe a diagram in a sentence and the AI draws it on a real draw.io canvas. Edit it by hand like any draw.io file, or select a few shapes and tell the AI what to change. Every AI change is a version you can compare, restore or undo, and the result exports as .drawio, .png or .svg.

Available as a web app, a desktop app for Windows, macOS and Linux, and an MCP server for AI agents such as Claude Code, Cursor and VS Code.

Highlights

Draw

Architecture diagrams, flowcharts, sequence diagrams and more from one sentence, with built-in AWS, Azure, GCP and Kubernetes icon libraries
Connectors can carry a flowing animation
Upload a screenshot or a sketch and the AI redraws it; upload PDF, Markdown, code and other text files and get a diagram of their content

Edit

Edit by chat: changes stream onto the canvas and the shapes the AI just changed are highlighted
Ask about a selection: select shapes on the canvas and the AI changes only those
Versions and undo: every AI change is a version card with a thumbnail; compare it with the canvas, restore it or undo it, and Ctrl+Z on the canvas also takes back an AI change in one step
It is a normal draw.io diagram: double-click to rename, drag, restyle, use several pages, and export as .drawio, .png, .svg or .drawio.svg at any time

Use

25 model providers, including an OpenAI-compatible preset for any other URL; enter your own API key in the browser and it stays on your machine
Models that reason show their thinking
Dark mode; the interface is available in English, Simplified Chinese, Traditional Chinese and Japanese

Examples

  Highly available web app on AWS

GitHub で README 全文を見る

インストール

npx @next-ai-drawio/mcp-server@latest

MCP 初心者？mcpskill.org のガイドから始めましょう →

設定

{
  "mcpServers": {
    "drawio": {
      "command": "npx",
      "args": ["@next-ai-drawio/mcp-server@latest"]
    }
  }
}