tldraw Desktop Canvas API 用于通过本地 HTTP 接口以编程方式创建和修改 tldraw 桌面应用中的图表。所有 API 调用必须使用 curl,不应使用 fetch、wget 或其他 HTTP 客户端。
用途
该工具适用于用户要求绘制图表、创建视觉内容、草拟线框图,或通过本地 HTTP API(端口 7236)与 tldraw 桌面画布交互的场景。
主要能力
- 列出当前打开的文档,获取文档 ID。
- 读取指定文档当前页面上的所有形状。
- 通过结构化动作创建、更新、删除形状,支持矩形、椭圆、三角形、菱形、六边形、胶囊、云、星形、心形、五边形、八边形、叉框、勾选框、梯形、平行四边形、粗箭头等多种形状类型。
- 支持文本、箭头、线条、便签、手绘等元素。
- 提供对齐、分布、堆叠、放置、移动、缩放、旋转、置顶、置底等布局操作。
- 支持通过 exec 接口运行任意 JavaScript 代码,以访问 tldraw Editor 的高级功能。
- 支持截图功能,可指定尺寸(small、medium、large、full)进行视觉验证。
使用方式
基本工作流程如下:
- 使用
curl -s http://localhost:7236/api/doc列出打开的文档,获取 DOC_ID。 - 使用
curl -s http://localhost:7236/api/doc/{id}/shapes读取当前形状。 - 使用
curl -s -X POST http://localhost:7236/api/doc/{id}/actions创建或修改形状。 - 使用
curl -s http://localhost:7236/api/doc/{id}/screenshot -o f.jpg截图验证结果。
每次修改后必须截图检查是否存在形状重叠、箭头交叉或文字拥挤等问题。若发现重叠,应使用 place、move、stack、align 或 distribute 等动作修复,并再次截图确认。
结构化动作通过 POST 到 /api/doc/:id/actions 发送,请求体为 {"actions": [...]}。同一请求中的所有动作视为单次撤销步骤。支持的动作包括 create、update、delete、clear、label、move、place、align、distribute、stack、resize、rotate、bringToFront、sendToBack、pen。
对于结构化动作未覆盖的高级操作,可使用 exec 接口:curl -s -X POST "$BASE/exec" -H "Content-Type: application/json" -d '{"code": "return editor.getCurrentPageShapeIds().size"}'。完整 SDK 文档可通过 curl -s http://localhost:7236/api/llms 获取。
适用场景
- 自动化生成流程图、架构图、决策图等。
- 快速创建线框图和视觉草图。
- 通过脚本批量修改 tldraw 画布内容。
- 需要以编程方式与 tldraw 桌面应用交互的自动化任务。
限制
- 必须使用 curl 进行所有 HTTP 调用。
- 依赖本地 tldraw 桌面应用运行在端口 7236。
- 每次修改后必须截图检查重叠,并修复布局问题。
- 大型图表(7 个以上形状)建议分阶段构建,逐步添加并调整布局。
- 默认形状尺寸约为 300x200,形状间距约 200。
- 默认样式为黑色、中等粗细、绘制风格、居中文本、无填充。
- 建议为形状分配可读的 shapeId,便于后续引用。
- 关于收费、价格、平台支持等具体信息暂未提供。