Press Ctrl+ and K to search
็ฎๅฝ
๐จ AI Agent Draw.io๏ผ็จ่ช็ถ่ฏญ่จใ่ฏดใๅบไธๅผ ๆถๆๅพ
ไฝ ๆๆฒกๆ็ปๅ่ฟ่ฟๆ ท็ๅบๆฏโโ่ๅญ้ๆไธๅผ ๆธ ๆฐ็ๆถๆๅพ๏ผๆๅผ draw.io ๅดๅฏน็็ฉบ็ฝ็ปๅธๅๅๅๅ้๏ผ่ฟไธช้กน็ฎๅฐฑๆฏๆฅ่งฃๅณ่ฟไธช้ฎ้ข็ใ
๐ GitHub ไปๅบ๏ผgithub.com/lechan775/ai-agent-drawio
๐ ไธๅฅ่ฏ่ฏดๆธ ๆฅ
AI Agent Draw.io ๆฏไธไธช AI ้ฉฑๅจ็ๆบ่ฝๆถๆๅพ็ๆๅนณๅฐใไฝ ๅช้่ฆ็จไธญๆๆ่ฑๆๆ่ฟฐๆณ่ฆ็ปไปไนโโ"็ปไธไธชๅพฎๆๅกๆถๆ๏ผๅ ๅซ API GatewayใไธไธชๅพฎๆๅกใMySQL ๅ Redis"โโAI Agent ๅฐฑ่ฝ่ชๅจๅจๅตๅ ฅๅผ draw.io ็ปๅธไธๆธฒๆๅบไธไธ็บงๅพ่กจใ
ๆดๅ ณ้ฎ็ๆฏ๏ผๅฎไธๆฏไธไธช็ฎๅ็ ChatGPT ๅฅๅฃณ๏ผๅ็ซฏๅบไบ Google ADK ๅฎ็ฐไบๅฎๆด็ Multi-Agent ็ผๆใMCP ๅ่ฎฎๅทฅๅ ท้พ้ๆ๏ผไปฅๅ Sequential / Parallel / Loop ไธ็ง Agent ๅทฅไฝๆตๆจกๅผใ
๐๏ธ ๆดไฝๆถๆ
โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ โ ๐ ็จๆทๆต่งๅจ โ โ โ โ โโโโโโโโโโโโโโโโโโโโโโโ โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ โ โ โ ๐ฌ ๅฏน่ฏ้ขๆฟ โ โ ๐ Draw.io ๅตๅ ฅๅผ็ปๅธ โ โ โ โ โ โ โ โ โ โ โข Agent ้ๆฉไธๆ โ โโ โ โข AI ็ๆ็ XML ๅฎๆถๆธฒๆ โ โ โ โ โข ๅค่ฝฎๅฏน่ฏๅๅฒ โ โ โข ้ผ ๆ ๆๆฝๅพฎ่ฐ โ โ โ โ โข ๆตๅผๆๅญๆๆ โ โ โข SVG/PNG ไธ้ฎๅฏผๅบ โ โ โ โ โข ็ปๅธไธไธๆๆบๅธฆ โ โ โข ๅคไผ่ฏ็ปๅธ็ฌ็ซ็ฎก็ โ โ โ โโโโโโโโโโโฌโโโโโโโโโโโโ โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ โ โโโโโโโโโโโโโโโผโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ โ HTTP REST + SSE ๆตๅผ โผ โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ โ โ Spring Boot ๅ็ซฏ (Java 17) โ โ โ โ โโโโโโโโโโโโ โโโโโโโโโโโโ โโโโโโโโโโโโ โโโโโโโโโโโโโโโโ โ โ โ Trigger โ โ App โ โ Domain โ โInfrastructureโ โ โ โ (HTTP) โโโโถโ (Config) โโโโถโ (Agent) โโโโถโ (DB/Redis) โ โ โ โโโโโโโโโโโโ โโโโโโโโโโโโ โโโโโโฌโโโโโโ โโโโโโโโโโโโโโโโ โ โ โ โ โ โโโโโโโโโโโโโโโโโโโโโโโโโโโโโผโโโโโโโโโโโโโโโโโโโโโโโโ โ โ โผ โผ โผ โ โ โโโโโโโโโโโโโโโโ โโโโโโโโโโโโโโโโโโโโโโโ โโโโโโโโโโโโโโโโ โ โ โ Google ADK โ โ Spring AI โ โ LangChain4j โ โ โ โ Agent ็ผๆ โ โ Tool/LLM/MCP ้ๆ โ โ MCP/LLM ้ๆโ โ โ โโโโโโโโโโโโโโโโ โโโโโโโโโโโโโโโโโโโโโโโ โโโโโโโโโโโโโโโโ โ โ โ โ โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ โ โ โ ๐ MCP Protocol (Model Context Protocol) โ โ โ โ โโโโโโโโโโโ โโโโโโโโโโโ โโโโโโโโโโโ โ โ โ โ โSSE Clientโ โ STDIO โ โ Local โ โ ๅทฅๅ ทๆฅๅ ฅ โ โ โ โ โ่ฟ็จๆๅก โ โๅญ่ฟ็จ โ โๆฌๅฐๅฝๆฐ โ โ โ โ โ โโโโโโโโโโโ โโโโโโโโโโโ โโโโโโโโโโโ โ โ โ โ โ โ โ โ โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ โ โ โ โ โ MCP Server (ๅฏนๅคๆด้ฒ) โ โ ไพๅ ถไปAgent โ โ โ โ โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ โ โ โ โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ โ โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ
๐ฅ ๆ ธๅฟไบฎ็น
1. ่ช็ถ่ฏญ่จ โ ๅพ่กจ๏ผ็ซฏๅฐ็ซฏ้ญ็ฏ
ไธๆฏๆ AI ๅๅค copy-paste ๅฐ draw.io๏ผ่ๆฏ AI ็ดๆฅๆๆง็ปๅธใๅ็ซฏ Agent ่พๅบ draw.io XML ๆ ผๅผ๏ผๅ็ซฏ react-drawio ็ปไปถๅฎๆถ่งฃๆๅนถๆธฒๆใ
json// Agent ๅๅบ็ปๆ
{
"type": "drawio", // โ ๅ่ฏๅ็ซฏ๏ผ่ฟๆฏๅพ๏ผ็ดๆฅๆธฒๆ
"content": "<mxGraphModel>...</mxGraphModel>"
}
ๅฝ type ไธบ user ๆถ๏ผๅ
ๅฎนๆธฒๆๅฐ่ๅคฉ้ขๆฟ๏ผ่ฟฝ้ฎใๆพๆธ
๏ผ๏ผๅฝ type ไธบ drawio ๆถ๏ผๅ
ๅฎน็ดๆฅๆจๅ
ฅ็ปๅธใ
2. ็ปๅธไธไธๆใๆบๅธฆใ่ฝๅ
่ฟๆฏๅบๅซไบๆฎ้ Chat-to-Diagram ๅทฅๅ ท็ๅ ณ้ฎ่ฎพ่ฎกใไฝ ๅฏไปฅๅ ๅจ draw.io ็ปๅธไธๆๅจๆๅบๅคง่ด็ปๆ๏ผ็ถๅๆๅผใๆบๅธฆ็ปๅธไธไธๆใๅผๅ ณโโๅฝๅ็ปๅธ็ๅ จ้จ็ถๆไผไฝไธบไธไธๆๅไผ ็ป Agent๏ผๅฎ็ฐๅข้ไฟฎๆน่้ๆฏๆฌก้ฝไปๅคด็ๆใ
3. Google ADK ๅคๆบ่ฝไฝ็ผๆ
ๅ็ซฏไธๆฏ็ฎๅ่ฐไธๆฌก LLM๏ผ่ๆฏๅบไบ Google Agent Development Kit (ADK) ๆๅปบ็ๅฎๆด Agent ็ณป็ป๏ผ
| ๅทฅไฝๆตๆจกๅผ | ่ฏดๆ | ๅ ธๅๅบๆฏ |
|---|---|---|
SequentialAgentNode | ้กบๅบๆง่กๅคไธชๅญ Agent | ๅ ๆ็ดข่ตๆ โ ๅ็ๆๅพ่กจ |
ParallelAgentNode | ๅนถ่กๆง่กๅคไธชๅญ Agent | ๅๆถๆฅ่ฏขๅคไธชๆฐๆฎๆบ |
LoopAgentNode | ๅพช็ฏ่ฟญไปฃๆง่ก | ็ๆ โ ่ชๆฃ โ ไฟฎๆญฃ โ ๅ็ๆ |
yaml# Agent ้
็ฝฎ็คบไพ (agent-draw-io.yml)
agent:
agentId: drawioagent
agentName: "Draw.io ๆถๆๅฉๆ"
chatModel:
model: gpt-5.1
tool:
mcp:
- name: baidu-search # MCP ๅทฅๅ
ท๏ผ่็ฝๆ็ดข
type: sse
baseUri: http://appbuilder.baidu.com/v2/ai_search/mcp/
4. MCP ๅ่ฎฎๆทฑๅบฆ้ๆ
ๅ็ซฏๅๆถไฝไธบ MCP Client ๅ MCP Server ่ฟ่ก๏ผ
- Client ไพง๏ผๆฅๅ ฅ็พๅบฆๆ็ดข็ญๅค้จ MCP ๆๅก๏ผAgent ๅฏไปฅๅฎๆถๆฃ็ดขๆๆฏๆๆกฃๆฅ่พ ๅฉ็ปๅพ
- Server ไพง๏ผๆด้ฒ่ชๅฎไน MCP ๅทฅๅ ทไพๅ ถไป AI Agent ่ฐ็จ๏ผๅฎ็ฐ Agent-to-Agent ้ไฟก
5. DDD ๅ ญๅฑๆถๆ๏ผๅทฅ็จๅๆๆปก
ๅ็ซฏไธฅๆ ผ้ตๅพช้ขๅ้ฉฑๅจ่ฎพ่ฎก๏ผDDD๏ผๅๅฑ๏ผๆจกๅ่พน็ๆธ ๆฐ๏ผ
ai-agent-scaffold-draw-io/ โโโ api/ # RPC ๆฅๅฃๅฅ็บฆ + DTO โโโ app/ # ๅฏๅจๅ ฅๅฃ + ่ชๅจ้ ็ฝฎ โโโ domain/ # ้ขๅๆ ธๅฟ๏ผAgentใChatใMCPใๅทฅไฝๆต๏ผ โโโ infrastructure/ # DB/Redis/ๅค้จ็ฝๅ ณ โโโ trigger/ # HTTP Controller โโโ types/ # ้็จๆไธพ/ๅผๅธธ
๐ฏ ๆๆฏ้ๅ
| ๅฑ็บง | ๆๆฏ้ๅ | ้ๅ็็ฑ |
|---|---|---|
| ๅ็ซฏๆกๆถ | Spring Boot 3.4.3 | ็ๆๆ็๏ผ้ ็ฝฎ้ฉฑๅจ๏ผไธ Spring AI ๆ ็ผ้ๆ |
| AI Agent ๅผๆ | Google ADK 0.5.0 | ๅ็ๆฏๆ Multi-Agent ็ผๆใSession ็ฎก็ใๆตๅผไบไปถ |
| LLM ้ๆ | Spring AI + LangChain4j ๅ้้ | Spring AI ็จไบไธป้พ่ทฏ๏ผLangChain4j ไฝไธบๅค้ไธ MCP ่กฅๅ |
| ๅทฅๅ ทๅ่ฎฎ | MCP (SSE/STDIO/Local) | ๆ ๅๅๅทฅๅ ทๆฅๅ ฅ๏ผAI Agent ไบ่ไบ้็ๆ ๅๅ่ฎฎ |
| ๅ็ซฏๆกๆถ | Next.js 16 + React 19 | SSR ไผๅ + RSC ๆถๆ๏ผ็ไบง็บงๆง่ฝ |
| ๅพ่กจๅผๆ | react-drawio (draw.io ๅตๅ ฅ) | ไธ็ๆ ๅๅพ่กจ็ผ่พๅจ๏ผXML ้ฉฑๅจ๏ผ้ถๅญฆไน ๆๆฌ |
| ๆ ทๅผๆนๆก | Tailwind CSS v4 | ๅๅญๅ CSS๏ผ่ฎพ่ฎก็ณป็ปไธ่ดๆง |
| ้จ็ฝฒ | Docker Compose | MySQL + Redis + ๅๅ็ซฏไธ้ฎ็ผๆ |
๐ ไธๅ้ๆฌๅฐ่ท่ตทๆฅ
ๅ็ฝฎๆกไปถ
- JDK 17+
- Maven 3.6+
- Node.js 20+
- (ๅฏ้) Docker 24+
ไธๆญฅๅฏๅจ
bash# Step 1๏ผ็ผ่ฏๅ็ซฏ
cd ai-agent-scaffold-draw-io
mvn clean package -DskipTests
java -jar ai-agent-scaffold-draw-io-app/target/ai-agent-scaffold-draw-io-app.jar
# Step 2๏ผๅฏๅจๅ็ซฏ๏ผๆฐ็ป็ซฏ๏ผ
cd ai-agent-scaffold-draw-io-front
npm install
NEXT_PUBLIC_API_BASE_URL=http://localhost:8091/api/v1 npm run dev
# Step 3๏ผๆๅผๆต่งๅจ
# ่ฎฟ้ฎ http://localhost:3000๏ผ้ๆฉ Agent๏ผๅผๅงๅฏน่ฏ๏ผ
Docker ๅ จๅฎถๆกถ๏ผ็ไบง็ฏๅข๏ผ
bash# ๅบ็ก่ฎพๆฝ๏ผMySQL + Redis + ็ฎก็้ขๆฟ๏ผ
docker-compose -f docs/dev-ops/docker-compose-environment-aliyun.yml up -d
# ๅบ็จ๏ผๅ็ซฏ 8091 + ๅ็ซฏ 3000๏ผ
docker-compose -f docs/dev-ops/docker-compose-app.yml up -d
| ๆๅก | ็ซฏๅฃ | ่ฏดๆ |
|---|---|---|
| ๅ็ซฏ | :3000 | AI Chat + Draw.io ็ปๅธ |
| ๅ็ซฏ API | :8091 | REST + SSE ๆตๅผ |
| phpMyAdmin | :8899 | MySQL ๅฏ่งๅ็ฎก็ |
| RedisAdmin | :8081 | Redis ๅฏ่งๅ็ฎก็ |
๐ก API ไธ่ง
| ๆนๆณ | ่ทฏๅพ | ่ฏดๆ |
|---|---|---|
GET | /api/v1/query_ai_agent_config_list | ่ทๅๅฏ็จ Agent ๅ่กจ |
POST | /api/v1/create_session | ๅๅปบๅฏน่ฏ Session |
POST | /api/v1/chat | ๅ้ๆถๆฏ๏ผ่ฟๅ Agent ๅๅบ |
POST | /api/v1/chat_stream | SSE ๆตๅผๅฏน่ฏ |
ๅฏน่ฏๆฅๅฃ็คบไพ
bashcurl -X POST http://localhost:8091/api/v1/chat \
-H "Content-Type: application/json" \
-d '{
"agentId": "drawioagent",
"userId": "demo_user",
"sessionId": "sess_001",
"message": "็ปไธไธชไธๅฑๆถๆ๏ผๅ็ซฏNext.jsใๅ็ซฏSpring BootใๆฐๆฎๅบMySQL๏ผ็จ็ฎญๅคดๆ ๆณจๆฐๆฎๆตๅ"
}'
ๅๅบไธญๅ
ๅซ type: "drawio" ็ๆถๆฏ๏ผๅ็ซฏไผ่ชๅจๆธฒๆๅฐ็ปๅธใ
๐งญ Agent ๅ ้จๅทฅไฝๆต
ไธไธชๅฎๆด็็ปๅพ่ฏทๆฑๅจ Agent ๅ ้จ็ป่ฟๅฆไธๆต็จ๏ผ
็จๆท่พๅ ฅ "็ปๅพฎๆๅกๆถๆๅพ" โ โผ โโโโโโโโโโโโโโโโโโโโโ โ RootNode โ โ ๆฅๆถ็จๆทๅๅง่พๅ ฅ โ ๆๅพ่งฃๆ โ โโโโโโโโโโฌโโโโโโโโโโโ โ โผ โโโโโโโโโโโโโโโโโโโโโ โ ChatModelNode โ โ ่ฐ็จ LLM (GPT/Claude/DeepSeek...) โ ้ๆฑ็่งฃ + ๆฃ็ดข โ MCP ๅทฅๅ ท๏ผ็พๅบฆๆ็ดข่กฅๅ ๆๆฏ็ป่ โโโโโโโโโโฌโโโโโโโโโโโ โ โผ โโโโโโโโโโโโโโโโโโโโโ โ AgentNode โ โ ๅฏ้็ๅทฅไฝๆต็ผๆ โ Sequential/ โ ๅค Agent ๅไฝๅค็ๅคๆๅพ่กจ โ Parallel/Loop โ โโโโโโโโโโฌโโโโโโโโโโโ โ โผ โโโโโโโโโโโโโโโโโโโโโ โ RunnerNode โ โ ๆ็ป่พๅบ draw.io XML โ ็ๆ XML ๆจกๆฟ โ ๆ ผๅผๅใ่ชๆฃใไฟฎๆญฃ โโโโโโโโโโฌโโโโโโโโโโโ โ โผ {"type": "drawio", "content": "<mxGraphModel>..."} โ โผ ๅ็ซฏ react-drawio ๅฎๆถๆธฒๆ ๐
๐ง Agent ่ชๅฎไน้ ็ฝฎ
ไฝ ๅฏไปฅ้่ฟ็ฏๅขๅ้็ตๆดปๅๆข LLM ๅๅทฅๅ ท้พ๏ผ
bash# ๆขไธชๆจกๅ่ฏ่ฏ Claude
export AI_AGENT_CONFIG_TABLES_DRAWIOAGENT_MODULE_AI_API_BASE_URL=https://api.anthropic.com
export AI_AGENT_CONFIG_TABLES_DRAWIOAGENT_MODULE_AI_API_API_KEY=sk-ant-xxx
export AI_AGENT_CONFIG_TABLES_DRAWIOAGENT_MODULE_CHAT_MODEL_MODEL=claude-3-opus
# ๆฅๅ
ฅไฝ ่ชๅทฑ็ MCP ๆๅก
export AI_AGENT_CONFIG_TABLES_DRAWIOAGENT_MODULE_CHAT_MODEL_TOOL_MCP_LIST_0_SSE_NAME=my-tool
export AI_AGENT_CONFIG_TABLES_DRAWIOAGENT_MODULE_CHAT_MODEL_TOOL_MCP_LIST_0_SSE_BASE_URI=https://my-mcp-server
export AI_AGENT_CONFIG_TABLES_DRAWIOAGENT_MODULE_CHAT_MODEL_TOOL_MCP_LIST_0_SSE_SSE_ENDPOINT=sse
๐ฌ ไฝฟ็จๅบๆฏ
- ็ณป็ป่ฎพ่ฎก่ฏๅฎก โ ๅฃๅคดๆ่ฟฐๆถๆ๏ผๅณๆถ็ๆๅฏ่งๅๅพ่กจ๏ผ็ๅปๆๆฝๆถ้ด
- ๆๆฏๆๆกฃ้ ๅพ โ ๅ README / ่ฎพ่ฎกๆๆกฃ / ่ฎบๆๆถ๏ผ็จ่ช็ถ่ฏญ่จๅฟซ้ๅบๅพ
- ๆๅญฆๆผ็คบ โ ่ฏพๅ ไธ็จๅฏน่ฏๆนๅผ้ๆญฅๆๅปบๆถๆ๏ผๅญฆ็็ด่ง็่งฃ็ปไปถๅ ณ็ณป
- ๅข้ไฟฎๆน โ ๅ ่ฎฉ AI ็ๆๅ็๏ผๆๅจๅพฎ่ฐๅธๅฑๅ๏ผๅ่ฎฉ AI ๆทปๅ ๆฐๆจกๅ
๐ฃ๏ธ ๅ็ปญ่งๅ
- ๆฏๆๅฏผๅบไธบ PNG/SVG/PDF ๅคๆ ผๅผ
- Agent Skills ็ญๅ ่ฝฝ๏ผๆ ้้ๅฏๅณๅฏๆทปๅ ๆฐ Agent๏ผ
- ๅคๆจกๆ่พๅ ฅ๏ผไธไผ ๆ็ป่ๅพ โ AI ่ฏๅซ โ ็ๆ่ง่ๅพ่กจ๏ผ
- Langfuse / LangSmith ๅฏ่งๆตๆง้ๆ
- Kubernetes Helm Chart ้จ็ฝฒๆนๆก
- ๅฏน่ฏๆจกๆฟๅธๅบ๏ผ็คพๅบ่ดก็ฎ Prompt ๆจกๆฟ๏ผ
๐ License
Apache License 2.0
โญ ๅฆๆ่ฟไธช้กน็ฎๅฏนไฝ ๆๅธฎๅฉ๏ผๆฌข่ฟ็ปไธช Star๏ผ
github.com/lechan775/ai-agent-drawio
Built with โค๏ธ by @lechan775 ยท ๅบ็กๆถๆๆบ่ช ๅฐๅ ๅฅ ็ DDD ่ๆๆถ
ๅฆๆๅฏนไฝ ๆ็จ็่ฏ๏ผๅฏไปฅๆ่ตๅฆ
ๆ่ต
ๆฌๆไฝ่ :williams
ๆฌๆ้พๆฅ:
็ๆๅฃฐๆ:ๆฌๅๅฎขๆๆๆ็ซ ้ค็นๅซๅฃฐๆๅค๏ผๅ้็จ BY-NC-SA ่ฎธๅฏๅ่ฎฎใ่ฝฌ่ฝฝ่ฏทๆณจๆๅบๅค๏ผ
็ฎๅฝ