Back to MCP directory
publicPublicdnsLocal runtime

tldraw-agent

tldraw-agent是一个基于AI的文本转图表生成工具,支持通过命令行、库、MCP服务等多种方式使用,可将文本描述(如架构图、流程图)自动生成为PNG或SVG格式的图表。

article

README

🚀 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 许可证。

help

Runtime guide

cloud

Hosted runtime

Hosted servers run from a provider-managed environment. You usually connect the MCP client to the hosted endpoint or follow the provider's authorization flow, without keeping a local process alive

  1. Open provider connection page
  2. Authorize or copy endpoint
  3. Connect from your MCP client
terminal

Local runtime / other methods

Local servers run on your own machine or infrastructure. You normally copy the server_config into your MCP client, install the required package, and provide env variables from env_schema when needed

  1. Copy server_config
  2. Install required package
  3. Fill env variables and restart client