Tldraw Agent

🚀 tldraw-agent

tldraw-agent 可以根據文本生成圖表，並且能在任何環境下使用。

🚀 快速開始

使用以下命令即可根據文本快速生成圖表：

npx tldraw-agent draw "User → API → Database"

📦 安裝指南

使用以下命令全局安裝 tldraw-agent：

npm install -g @joelhooks/tldraw-agent

💻 使用示例

命令行界面（CLI）

以下是幾個使用命令行界面生成圖表的例子：

tldraw-agent draw "microservices architecture with load balancer"
tldraw-agent draw "signup flow" --format svg -o signup.svg

作為庫使用

以下是如何在代碼中引入 tldraw-agent 庫並使用的示例：

import { TldrawAgent } from '@joelhooks/tldraw-agent'

const agent = new TldrawAgent()
const { path } = await agent.draw({ prompt: 'system diagram' })

MCP 配置

以下是在 MCP 中配置 tldraw-agent 的示例：

{
  "mcpServers": {
    "tldraw": { "command": "npx", "args": ["@joelhooks/tldraw-agent", "--mcp"] }
  }
}

✨ 主要特性

• 🖼️ 支持導出為 PNG/SVG 格式。
• 🤖 由大語言模型（如 Claude、GPT）驅動的佈局功能。
• 📐 可生成架構圖、流程圖、實體圖等。
• 🔌 支持多種使用方式，包括命令行界面、庫、MCP 工具或作為代理技能。

🔧 技術細節

使用前需要設置環境變量，配置所需的 API 密鑰：

export AI_GATEWAY_API_KEY=...  # Vercel/Cloudflare AI Gateway key

📄 許可證

本項目採用 MIT 許可證。