Smart Drawio

Name: Smart Drawio
Author: yunshenwuchuxun

โดย yunshenwuchuxunรุ่น 0.1.0i★ 366 (ดาวรวมทั้งรีโป)iรันบนเครื่อง

ชื่อใน registryio.github.yunshenwuchuxun/smart-drawio

วิธีติดตั้ง

ใช้ทำอะไรได้

ยังไม่มีคำอธิบายภาษาไทย ดูข้อเท็จจริงด้านล่าง หรือเปิดคำอธิบายต้นฉบับจากผู้ทำ

ต่อแบบ ติดตั้งในเครื่อง
บัญชีหรือคีย์ ต้องมี SMART_DRAWIO_API_KEY
หมวด ออกแบบ ภาพ และเสียง

คำอธิบายต้นฉบับจากผู้ทำ (อังกฤษ)

Generate, validate, repair and style editable draw.io XML diagrams.

ติดตั้ง

เลือกโปรแกรม AI ที่คุณใช้ แล้วคัดลอกค่าตั้งไปวาง

ผลตรวจผ่าน 3/3 · ทำงานบนเครื่องคุณ · ✓ ตรวจคำสั่งแล้ว 13 พ.ย. 2569

ขั้นแรก: คุณใช้ AI ตัวไหน

Claudeเว็บ · แอป · มือถือChatGPTเว็บClaude CodeTerminalCursorโปรแกรมเขียนโค้ดVS Codeโปรแกรมเขียนโค้ดอื่น ๆโปรแกรมอื่น

เลือกแอปที่คุณใช้ ขั้นตอนจะขึ้นด้านล่าง

ต่อกับ Claude ได้ แต่ต้องเตรียมก่อน

ต้องมีคีย์ของ Smart Drawio (สร้างที่เว็บของผู้ทำ) · ต้องลง Node.js ในเครื่องก่อน (ทำครั้งเดียว) · ใช้ได้เฉพาะแอป Claude บนคอม (Windows หรือ Mac) ไม่ใช่บนเว็บหรือมือถือ

ลง Node.js ในเครื่อง
ทำครั้งเดียว ใช้ได้กับทุกตัวที่ต้องใช้ Node.js
เปิดหน้าดาวน์โหลด Node.js ↗
ทำแล้ว
สมัครและสร้างคีย์ของ Smart Drawio
เปิดเว็บของผู้ทำ สมัครบัญชีแล้วสร้างคีย์ (API key) เก็บไว้ ใช้ในขั้นถัดไป ราคาและแผนฟรีดูที่เว็บของผู้ทำ
วิธีขอคีย์อยู่ใน README ของผู้ทำด้านล่าง
ทำแล้ว
เปิดไฟล์ตั้งค่าของแอป Claude บนคอม
SettingsDeveloperEdit Config
ทำแล้ว

วางค่าตั้งนี้แล้วบันทึกไฟล์

{
  "mcpServers": {
    "smart-drawio": {
      "command": "npx",
      "args": [
        "-y",
        "@yunshenwuchuxun/smart-drawio-mcp"
      ],
      "env": {
        "SMART_DRAWIO_PROVIDER": "ใส่ค่าของคุณ",
        "SMART_DRAWIO_BASE_URL": "ใส่ค่าของคุณ",
        "SMART_DRAWIO_API_KEY": "ใส่ค่าของคุณ",
        "SMART_DRAWIO_MODEL": "ใส่ค่าของคุณ"
      }
    }
  }
}

วางคีย์ในช่องของแอปเท่านั้น อย่าวางในแชตหรือส่งให้ใคร

ทำแล้ว

ปิดแอป Claude แล้วเปิดใหม่
ทำแล้ว
ลองเลย
ใช้ Smart Drawio บอกหน่อยว่าทำอะไรให้ฉันได้บ้าง แล้วลองทำให้ดูหนึ่งอย่าง
✓ ถ้า Claude บอกว่ากำลังใช้ Smart Drawio หรือมีชื่อเครื่องมือของ Smart Drawio ขึ้นในคำตอบ แปลว่าต่อสำเร็จ

ชื่อเมนูตรวจกับหน้าช่วยเหลือของ Anthropic เมื่อ 11 พ.ย. 2569 · หน้าจอของคุณอาจต่างเล็กน้อยตามรุ่นของแอป

ChatGPT ยังต่อ Smart Drawio ไม่ได้

Smart Drawio ต้องติดตั้งในเครื่องคุณ แต่ ChatGPT ต่อได้เฉพาะตัวที่ทำงานบนเว็บ

คุณทำแบบนี้แทนได้

ก · ใช้แอปที่ต่อ Smart Drawio ได้

ดูขั้นตอนสำหรับ Claude →ต้องมีคีย์ของ Smart Drawio (สร้างที่เว็บของผู้ทำ) · ต้องลง Node.js ในเครื่องก่อน (ทำครั้งเดียว) · ใช้ได้เฉพาะแอป Claude บนคอม (Windows หรือ Mac) ไม่ใช่บนเว็บหรือมือถือ
ดูขั้นตอนสำหรับ Claude Code →ต้องมีคีย์ของ Smart Drawio (สร้างที่เว็บของผู้ทำ) · ต้องลง Node.js ในเครื่องก่อน (ทำครั้งเดียว)
ดูขั้นตอนสำหรับ Cursor →ต้องมีคีย์ของ Smart Drawio (สร้างที่เว็บของผู้ทำ) · ต้องลง Node.js ในเครื่องก่อน (ทำครั้งเดียว)
ดูขั้นตอนสำหรับ VS Code →ต้องมีคีย์ของ Smart Drawio (สร้างที่เว็บของผู้ทำ) · ต้องลง Node.js ในเครื่องก่อน (ทำครั้งเดียว)

ข · ตัวอื่นในหมวด ออกแบบ ภาพ และเสียง ที่ต่อกับ ChatGPT ได้

เลือกจากตัวที่ใช้มากในหมวดเดียวกัน เฉพาะตัวที่ต่อด้วยที่อยู่ได้โดยไม่ต้องใส่คีย์

Pascal 3D Editor✓ ChatGPT
Semiotic✓ ChatGPT
TypeUI✓ ChatGPT

ต่อกับ Claude Code ได้ แต่ต้องเตรียมก่อน

ต้องมีคีย์ของ Smart Drawio (สร้างที่เว็บของผู้ทำ) · ต้องลง Node.js ในเครื่องก่อน (ทำครั้งเดียว)

ลง Node.js ในเครื่อง
ทำครั้งเดียว ใช้ได้กับทุกตัวที่ต้องใช้ Node.js
เปิดหน้าดาวน์โหลด Node.js ↗
ทำแล้ว
สมัครและสร้างคีย์ของ Smart Drawio
เปิดเว็บของผู้ทำ สมัครบัญชีแล้วสร้างคีย์ (API key) เก็บไว้ ใช้ในขั้นถัดไป ราคาและแผนฟรีดูที่เว็บของผู้ทำ
วิธีขอคีย์อยู่ใน README ของผู้ทำด้านล่าง
ทำแล้ว
เปิด Terminal
Mac: กด Command+Space พิมพ์ Terminal · Windows: เปิด PowerShell
ทำแล้ว
4
วางคำสั่งนี้แล้วกด Enter
```
claude mcp add --scope user smart-drawio --env SMART_DRAWIO_PROVIDER='ใส่ค่าของคุณ' --env SMART_DRAWIO_BASE_URL='ใส่ค่าของคุณ' --env SMART_DRAWIO_API_KEY='ใส่ค่าของคุณ' --env SMART_DRAWIO_MODEL='ใส่ค่าของคุณ' -- npx -y @yunshenwuchuxun/smart-drawio-mcp
```
แก้ “ใส่ค่าของคุณ” เป็นคีย์ของคุณก่อนกด Enter
วางคีย์ในช่องของแอปเท่านั้น อย่าวางในแชตหรือส่งให้ใคร
ทำแล้ว
พิมพ์ /mcp ใน Claude Code
ต้องเห็น Smart Drawio ในรายการและขึ้นว่าเชื่อมต่อแล้ว
ทำแล้ว
ลองเลย
ใช้ Smart Drawio บอกหน่อยว่าทำอะไรให้ฉันได้บ้าง แล้วลองทำให้ดูหนึ่งอย่าง
✓ ถ้า Claude Code บอกว่ากำลังใช้ Smart Drawio หรือมีชื่อเครื่องมือของ Smart Drawio ขึ้นในคำตอบ แปลว่าต่อสำเร็จ

ต่อกับ Cursor ได้ แต่ต้องเตรียมก่อน

ลง Node.js ในเครื่อง
ทำครั้งเดียว ใช้ได้กับทุกตัวที่ต้องใช้ Node.js
เปิดหน้าดาวน์โหลด Node.js ↗
ทำแล้ว
สมัครและสร้างคีย์ของ Smart Drawio
เปิดเว็บของผู้ทำ สมัครบัญชีแล้วสร้างคีย์ (API key) เก็บไว้ ใช้ในขั้นถัดไป ราคาและแผนฟรีดูที่เว็บของผู้ทำ
วิธีขอคีย์อยู่ใน README ของผู้ทำด้านล่าง
ทำแล้ว
กดปุ่มนี้เพื่อเปิด Cursor
เปิดใน Cursor
Cursor จะถามยืนยันการติดตั้ง ให้กด Install
ทำแล้ว
ใส่คีย์ในช่องที่ว่างไว้
ในค่าตั้งของ Smart Drawio ช่อง SMART_DRAWIO_PROVIDER, SMART_DRAWIO_BASE_URL, SMART_DRAWIO_API_KEY, SMART_DRAWIO_MODEL ยังว่าง ใส่คีย์ของคุณแล้วบันทึก
วางคีย์ในช่องของแอปเท่านั้น อย่าวางในแชตหรือส่งให้ใคร
ทำแล้ว
เปิดแชตของ AI ใน Cursor โหมด Agent
ทำแล้ว
ลองเลย
ใช้ Smart Drawio บอกหน่อยว่าทำอะไรให้ฉันได้บ้าง แล้วลองทำให้ดูหนึ่งอย่าง
✓ ถ้า Cursor บอกว่ากำลังใช้ Smart Drawio หรือมีชื่อเครื่องมือของ Smart Drawio ขึ้นในคำตอบ แปลว่าต่อสำเร็จ

ชื่อเมนูตรวจกับหน้าช่วยเหลือของ Cursor เมื่อ 11 พ.ย. 2569 · หน้าจอของคุณอาจต่างเล็กน้อยตามรุ่นของแอป

ต่อกับ VS Code ได้ แต่ต้องเตรียมก่อน

ลง Node.js ในเครื่อง
ทำครั้งเดียว ใช้ได้กับทุกตัวที่ต้องใช้ Node.js
เปิดหน้าดาวน์โหลด Node.js ↗
ทำแล้ว
สมัครและสร้างคีย์ของ Smart Drawio
เปิดเว็บของผู้ทำ สมัครบัญชีแล้วสร้างคีย์ (API key) เก็บไว้ ใช้ในขั้นถัดไป ราคาและแผนฟรีดูที่เว็บของผู้ทำ
วิธีขอคีย์อยู่ใน README ของผู้ทำด้านล่าง
ทำแล้ว
กดปุ่มนี้เพื่อเปิด VS Code
เปิดใน VS Code
VS Code จะถามยืนยันการติดตั้ง ให้กด Install
ทำแล้ว
ใส่คีย์ในช่องที่ว่างไว้
ในค่าตั้งของ Smart Drawio ช่อง SMART_DRAWIO_PROVIDER, SMART_DRAWIO_BASE_URL, SMART_DRAWIO_API_KEY, SMART_DRAWIO_MODEL ยังว่าง ใส่คีย์ของคุณแล้วบันทึก
วางคีย์ในช่องของแอปเท่านั้น อย่าวางในแชตหรือส่งให้ใคร
ทำแล้ว
เปิดแชตของ AI ใน VS Code โหมด Agent
ทำแล้ว
ลองเลย
ใช้ Smart Drawio บอกหน่อยว่าทำอะไรให้ฉันได้บ้าง แล้วลองทำให้ดูหนึ่งอย่าง
✓ ถ้า VS Code บอกว่ากำลังใช้ Smart Drawio หรือมีชื่อเครื่องมือของ Smart Drawio ขึ้นในคำตอบ แปลว่าต่อสำเร็จ

ชื่อเมนูตรวจกับหน้าช่วยเหลือของ VS Code เมื่อ 11 พ.ย. 2569 · หน้าจอของคุณอาจต่างเล็กน้อยตามรุ่นของแอป

โปรแกรมอื่นที่ใช้ MCP ได้ เช่น Windsurf, Zed หรือ Gemini CLI มีวิธีเพิ่มต่างกัน ดูวิธีของแต่ละตัวในหน้ารวมโปรแกรม

ดูโปรแกรมที่ใช้ MCP ทั้งหมด →

ค่าตั้งแบบไฟล์ JSON อยู่ในหัวข้อ “สำหรับคนเขียนโค้ด” ด้านล่าง

ติดตรงไหน? ถามคนที่ใช้ Smart Drawio อยู่💬 พูดคุย →

สำหรับคนเขียนโค้ด: คำสั่ง Terminal และค่าตั้ง JSON

ติดตั้งในเครื่อง

Claude Code

claude mcp add --scope user smart-drawio --env SMART_DRAWIO_PROVIDER='ใส่ค่าของคุณ' --env SMART_DRAWIO_BASE_URL='ใส่ค่าของคุณ' --env SMART_DRAWIO_API_KEY='ใส่ค่าของคุณ' --env SMART_DRAWIO_MODEL='ใส่ค่าของคุณ' -- npx -y @yunshenwuchuxun/smart-drawio-mcp

Claude Desktop (claude_desktop_config.json)

{
  "mcpServers": {
    "smart-drawio": {
      "command": "npx",
      "args": [
        "-y",
        "@yunshenwuchuxun/smart-drawio-mcp"
      ],
      "env": {
        "SMART_DRAWIO_PROVIDER": "ใส่ค่าของคุณ",
        "SMART_DRAWIO_BASE_URL": "ใส่ค่าของคุณ",
        "SMART_DRAWIO_API_KEY": "ใส่ค่าของคุณ",
        "SMART_DRAWIO_MODEL": "ใส่ค่าของคุณ"
      }
    }
  }
}

Cursor (~/.cursor/mcp.json)

{
  "mcpServers": {
    "smart-drawio": {
      "command": "npx",
      "args": [
        "-y",
        "@yunshenwuchuxun/smart-drawio-mcp"
      ],
      "env": {
        "SMART_DRAWIO_PROVIDER": "ใส่ค่าของคุณ",
        "SMART_DRAWIO_BASE_URL": "ใส่ค่าของคุณ",
        "SMART_DRAWIO_API_KEY": "ใส่ค่าของคุณ",
        "SMART_DRAWIO_MODEL": "ใส่ค่าของคุณ"
      }
    }
  }
}

VS Code (mcp.json)

{
  "servers": {
    "smart-drawio": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "@yunshenwuchuxun/smart-drawio-mcp"
      ],
      "env": {
        "SMART_DRAWIO_PROVIDER": "ใส่ค่าของคุณ",
        "SMART_DRAWIO_BASE_URL": "ใส่ค่าของคุณ",
        "SMART_DRAWIO_API_KEY": "ใส่ค่าของคุณ",
        "SMART_DRAWIO_MODEL": "ใส่ค่าของคุณ"
      }
    }
  }
}

ค่าที่ต้องใส่เอง

SMART_DRAWIO_PROVIDER env
openai or anthropic; required only for model generation
SMART_DRAWIO_BASE_URL env
Model provider HTTP(S) base URL; required only for model generation
SMART_DRAWIO_API_KEY ความลับ env
Your model provider API key; required only for model generation
SMART_DRAWIO_MODEL env
Model identifier; required only for model generation

ค่าตั้งนี้สร้างจากข้อมูลใน registry ของผู้ทำ ถ้าไม่ตรงกับ README ให้เชื่อ README

สรุป

ดาว GitHub i: 366 (ดาวรวมทั้งรีโป)
รีโปนี้มี MCP หลายรายการ ดาวนับในอันดับแค่รายการเดียว
ดาวน์โหลดต่อสัปดาห์i: 52/สัปดาห์
license i: MIT
การเชื่อมต่อ: รันบนเครื่อง
ช่องทาง (transport): stdio
รุ่นล่าสุดi: 0.1.0
หมวดi: ออกแบบ ภาพ และเสียง
ส่งเข้า registryi: 14 ต.ค. 2569
แก้โค้ดล่าสุดi: 15 ต.ค. 2569
ผู้ทำ: yunshenwuchuxun
แพ็กเกจ: npm: @yunshenwuchuxun/smart-drawio-mcp
repo: yunshenwuchuxun/smart-drawio-next
สถานะใน registry: ใช้งานอยู่

ใช้กับโปรแกรมไหนได้

ดูจากแบบการต่อของ server ตัวนี้ และเอกสารของผู้ทำโปรแกรมแต่ละตัว ตรวจเมื่อ 10 พ.ย. 2569

ติดตั้งบนเครื่องได้ใน

Claude Goose LM Studio Msty Studio Cherry Studio Cursor VS Code + GitHub Copilot Visual Studio Windsurf (Devin Desktop)Zed Kiro Cline Continue JetBrains AI Assistant Claude Code Codex CLI Gemini CLI OpenCode nodecode Warp LibreChat Raycast

ดูโปรแกรมทั้งหมดพร้อมข้อดีข้อเสีย →

คู่มือที่เกี่ยวข้อง

เรื่องที่ 8เช็ก 5 ข้อก่อนติดตั้ง MCP ไม่ให้ข้อมูลรั่วใช้เวลาราว 2 นาทีต่อตัว ดูจากหน้าของตัวนั้นบนเว็บเรา และหน้าขออนุญาตของโปรแกรม AI ก่อนกดยอมอ่าน 4 นาที

ทำอะไรได้บ้าง

รันในเครื่องคุณ รายการเครื่องมือจะขึ้นในแอป AI หลังติดตั้ง

ผลตรวจเบื้องต้นi

เราตรวจจากข้อมูลที่ใครก็เปิดดูได้ ยังไม่ได้อ่านโค้ด ข้อที่ไม่เกี่ยวกับตัวนี้ไม่นับในตัวหาร · ตรวจเมื่อ 13 พ.ย. 2569

✓ ผ่าน
ตัวตนผู้ทำตรงกับ repo
ชื่อใน registry ยืนยันด้วยบัญชี GitHub yunshenwuchuxun ซึ่งเป็นเจ้าของ repo
✓ ผ่าน
ยังมีคนดูแล
มีการแก้โค้ดล่าสุด 29 วันที่ผ่านมา
✓ ผ่าน
มีสัญญาอนุญาต (license)
ใช้ MIT
– ไม่เกี่ยว
endpoint ตอบ
ตัวนี้รันบนเครื่องคุณ ไม่มี endpoint บนอินเทอร์เน็ต
– ไม่เกี่ยว
ล็อกอินแบบ OAuth
ตัวนี้รันบนเครื่อง ใช้ค่าที่ตั้งในเครื่องแทน
… ยังไม่ตรวจ
คำอธิบายเครื่องมือไม่มีคำสั่งแอบแฝง
รันในเครื่องคุณ เราอ่านรายการเครื่องมือได้เฉพาะตัวที่มี endpoint บนอินเทอร์เน็ต

พูดคุย

ถาม แชร์เคล็ดลับ หรือแจ้งว่าใช้ไม่ได้ เรียงตามที่คนกดว่ามีประโยชน์

ยังไม่มีใครโพสต์ ถามหรือแชร์เป็นคนแรกได้เลย

ข้อความในส่วนนี้เขียนโดยผู้ใช้ ไม่ใช่ทีม PopNx

เข้าสู่ระบบด้วย Google เพื่อโพสต์

รีวิวจากผู้ใช้

ยังไม่มีรีวิว

เข้าสู่ระบบด้วย Google เพื่อเขียนรีวิว

เทียบกับตัวอื่นในหมวด ออกแบบ ภาพ และเสียงi

ดาวมากกว่า 97% ของอีก 2996 ตัวในหมวดนี้
ส่งรุ่นใหม่เข้า registry ล่าสุดกว่า 49% ของอีก 2996 ตัวในหมวดนี้
ผลตรวจเบื้องต้นดีกว่าหรือเท่ากับ 100% ของอีก 2996 ตัวในหมวดนี้

เทียบกับทุก server ที่ยังใช้งานในหมวดนี้ทั้งทะเบียน ดาวนับเฉพาะเมื่อผู้ลงทะเบียนเป็นเจ้าของ repo

คำถามที่พบบ่อย

Smart Drawio ปลอดภัยไหม?

จากการตรวจเบื้องต้นของเรา ผ่าน 3 จาก 3 ข้อที่ตรวจได้ เรายังไม่ได้อ่านโค้ด ก่อนใส่กุญแจหรือ token ให้ดูว่า server ขอสิทธิ์อะไร และเลือกกุญแจที่ทำได้เท่าที่จำเป็น

ต้องใช้กุญแจหรือรหัสอะไรบ้าง?

ต้องใส่ค่าเหล่านี้: SMART_DRAWIO_API_KEY

ตัวนี้รันบนเครื่องหรือบนคลาวด์?

รันบนเครื่องของคุณ โปรแกรม AI จะเปิด server ขึ้นมาเองเมื่อใช้ ข้อมูลไม่ต้องผ่านเซิร์ฟเวอร์ของผู้ทำ (ยกเว้นตัวที่ไปเรียกบริการออนไลน์ต่อ)

ยังมีคนดูแลอยู่ไหม?

repo บน GitHub มีการแก้โค้ดล่าสุด 29 วันที่ผ่านมา และส่งรุ่นล่าสุด (0.1.0) เข้า registry 30 วันที่ผ่านมา

ใช้กับโปรแกรมไหนได้บ้าง?

โปรแกรมที่รองรับ MCP เช่น Claude Desktop, Claude Code, Cursor และ VS Code ตัวนี้ต้องมี Node.js ในเครื่องด้วย

มีตัวไหนใช้แทนได้บ้าง?

ในหมวดเดียวกันมี Figma Context MCP, AutoClip, Next AI Draw.io

ตัวอื่นในหมวดเดียวกัน

server หมวดเดียวกันจากผู้ทำคนอื่น เรียงตามดาว

อ่านการ์ด:↓ ดาวน์โหลดต่อสัปดาห์i★ ดาว GitHubiสามเสา: รีวิว · ผลตรวจ · การใช้งานiอัปเดต = วันที่ส่งรุ่นล่าสุดเข้า registryi

Figma Context MCP

Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.

โดย GLipsใช้กันมาก↓ 152.1K/สัปดาห์★ 16.2Kอัปเดต 5 เดือนที่ผ่านมา

รันบนเครื่อง

ติดตั้ง

AutoClip

Clip long videos into short clips with covers and captions. Local CLI and MCP.

โดย zhouxiaokaใช้กันมาก↓ 205/สัปดาห์★ 10.4Kอัปเดต 16 วันที่ผ่านมา

รันบนเครื่อง

ติดตั้ง

Next AI Draw.io

draw.io diagrams your AI agent draws on a live browser canvas that you can also edit by hand

โดย DayuanJiangใช้กันมาก↓ 21.7K/สัปดาห์★ 36.9K ดาวรวมทั้งรีโปอัปเดต วันนี้

รันบนเครื่อง

ติดตั้ง

README จากผู้ทำ

เปิดอ่าน README

ส่วนนี้คัดจาก repo ของผู้ทำตามต้นฉบับ PopNx MCP ไม่ได้ตรวจหรือรับรองเนื้อหา ตัด HTML รูปภาพ และสคริปต์ออกแล้ว ลิงก์จะพาออกนอกเว็บ

Smart Drawio MCP

A local MCP server for generating, validating, repairing and styling editable draw.io XML. It shares the diagram core with Smart Drawio Next. It uses stdio and does not require the Next.js website, a browser, or draw.io Desktop.

Install from npm

Use Node.js 20.9 or later. Configure a client that supports local stdio MCP servers:

"mcpServers": { "smart-drawio": { "command": "npx", "args": ["-y", "@yunshenwuchuxun/smart-drawio-mcp@0.1.0"] } } }

The client starts the MCP process. Validation, repair, styling and option discovery work immediately. Configure the four model environment variables below to enable generation.

The Smart Drawio Skill can also use the agent's own model to create XML and then optionally call these tools.

Run from this repository

Use Node.js 20.9 or later. Build from the repository root:

pnpm install --frozen-lockfile

pnpm build:mcp

Configure a client that supports local stdio MCP servers:

"mcpServers": { "smart-drawio": { "command": "node", "args": ["/absolute/path/smart-drawio-next/packages/mcp/dist/stdio.js"] } } }

Replace the absolute path with your checkout path. The client launches the process; running the executable directly waits for JSON-RPC on stdin. stdout contains only MCP messages.

The npm executable is smart-drawio-mcp. Running it directly waits for JSON-RPC on stdin; it is intended to be started by an MCP client.

Optional model configuration

Validation, repair, styling and the options catalog work without model credentials. Only generate_drawio requires the following four environment variables, set on the MCP process:

Variable	Meaning
`SMART_DRAWIO_PROVIDER`	`openai` or `anthropic`
`SMART_DRAWIO_BASE_URL`	Compatible HTTP(S) base URL, e.g. `https://api.openai.com/v1` or a local model endpoint
`SMART_DRAWIO_API_KEY`	Provider API key; for a local endpoint that ignores authentication, use a non-empty placeholder
`SMART_DRAWIO_MODEL`	Model ID supported by that provider

Use your client's environment or secret settings. Credentials are absent from tool arguments and results. Localhost and custom HTTP(S) providers are supported. A base URL must not contain embedded credentials, query parameters or fragments.

Example using placeholder settings in the client configuration:

"mcpServers": { "smart-drawio": { "command": "node", "args": ["/absolute/path/smart-drawio-next/packages/mcp/dist/stdio.js"], "env": { "SMART_DRAWIO_PROVIDER": "openai", "SMART_DRAWIO_BASE_URL": "http://localhost:11434/v1", "SMART_DRAWIO_API_KEY": "local-placeholder", "SMART_DRAWIO_MODEL": "your-local-model-id" } } } }

Restart the MCP process after changing its model settings. Generation has a 240-second total deadline and a 60-second inactivity deadline. Client cancellation aborts the provider request.

Tools

Tool	Inputs	Behavior
`list_drawio_options`	`{}`	Discover IDs and descriptions for chart types, themes, style packs, presets, text tools and tricks
`validate_drawio`	`xml`	Validate XML syntax, IDs, parents and edge references
`repair_drawio`	`xml`	Repair supported missing closing tags and validate the repaired result
`style_drawio`	`xml`; optional `theme`, `sourceTheme`, `stylePack`, `presets`, `textTool`, `trick`	Return a transformed XML document; `presets` is an ID-to-boolean map
`generate_drawio`	`prompt`; optional `chartType="auto"`, `theme="research"`	Generate with the configured provider and return complete, validated XML

Every result includes structuredContent with ok, diagnostics, and optional xml, stats or options. Text content includes diagnostics and the XML when available. Tool failures set isError: true; invalid tool arguments are rejected by the MCP SDK. Cancelled calls follow MCP cancellation semantics.

Example style request after discovering the IDs:

"xml": " ... ", "stylePack": "researchClean", "presets": { "shadow": false } }

Supported scope

This version handles uncompressed .drawio XML, with an MCP input limit of 2,097,152 characters per XML document. Prompts are limited to 262,144 characters. Compressed diagrams and legacy JSON drawing formats must be converted to uncompressed XML first.

The server returns diagram data in memory. The client decides whether and where to save .drawio files. It does not read the current browser canvas, select nodes, export PNG/PDF screenshots, manage realtime editor sessions or offer a remote HTTP MCP endpoint.

Import the returned XML into draw.io, or use the Smart Drawio Next website for visual editing. Generation calls the configured external provider; validation, repair and style transformations stay local.

Factory API

import { createSmartDrawioServer } from '@yunshenwuchuxun/smart-drawio-mcp';

import { serveStdio } from '@modelcontextprotocol/server/stdio';

serveStdio(() => createSmartDrawioServer());

createSmartDrawioServer({ env, core }) allows a supplied environment and core implementation for embedding or testing. The package also exports the shared diagram core under @yunshenwuchuxun/smart-drawio-mcp/core.

Smart Drawio

ใช้ทำอะไรได้

ติดตั้ง

ลง Node.js ในเครื่อง

สมัครและสร้างคีย์ของ Smart Drawio

เปิดไฟล์ตั้งค่าของแอป Claude บนคอม

วางค่าตั้งนี้แล้วบันทึกไฟล์

ปิดแอป Claude แล้วเปิดใหม่

ลองเลย

คุณทำแบบนี้แทนได้

ลง Node.js ในเครื่อง

สมัครและสร้างคีย์ของ Smart Drawio

เปิด Terminal

วางคำสั่งนี้แล้วกด Enter

พิมพ์ /mcp ใน Claude Code

ลองเลย

ลง Node.js ในเครื่อง

สมัครและสร้างคีย์ของ Smart Drawio

กดปุ่มนี้เพื่อเปิด Cursor

ใส่คีย์ในช่องที่ว่างไว้

เปิดแชตของ AI ใน Cursor โหมด Agent

ลองเลย

ลง Node.js ในเครื่อง

สมัครและสร้างคีย์ของ Smart Drawio

กดปุ่มนี้เพื่อเปิด VS Code

ใส่คีย์ในช่องที่ว่างไว้

เปิดแชตของ AI ใน VS Code โหมด Agent

ลองเลย

ติดตั้งในเครื่อง

ค่าที่ต้องใส่เอง

สรุป

ใช้กับโปรแกรมไหนได้

คู่มือที่เกี่ยวข้อง

ทำอะไรได้บ้าง

ผลตรวจเบื้องต้นi

ตัวตนผู้ทำตรงกับ repo

ยังมีคนดูแล

มีสัญญาอนุญาต (license)

endpoint ตอบ

ล็อกอินแบบ OAuth

คำอธิบายเครื่องมือไม่มีคำสั่งแอบแฝง

พูดคุย

รีวิวจากผู้ใช้

เทียบกับตัวอื่นในหมวด ออกแบบ ภาพ และเสียงi

คำถามที่พบบ่อย

ตัวอื่นในหมวดเดียวกัน

Figma Context MCP

AutoClip

Next AI Draw.io

README จากผู้ทำ

Smart Drawio MCP

Install from npm

Run from this repository

Optional model configuration

Tools

Supported scope

Factory API