tldraw：开源在线白板的特性与本地接入方式

tldraw 是一款免费开源、支持协作的在线数字白板，可用于绘图、图表制作与团队协作。项目基于 TypeScript，遵循 tldraw 开源协议，代码托管在 GitHub：

https://github.com/tldraw/tldraw

功能特性

• 绘图工具：画笔、橡皮、线条、形状、文本等基础工具齐全，支持颜色、大小、字体设置，也可插入图片、视频等媒体文件。
• 团队协作：多人实时协作，分享链接即可共同编辑，支持只读模式与发布。
• 导入导出：导出或复制为 PNG、SVG 等格式，支持导入/导出 tldr 文件。
• 界面定制：界面简洁，提供暗黑模式、专注模式和快捷键操作。
• 多种形态：既可直接使用在线工具，也可本地部署或嵌入自有项目。
• 多语言：支持包括中文在内的多种界面语言。
• 扩展开发：编辑器、UI 及底层库全部开源，支持自定义形状、工具等深度定制。

在线使用

官方在线环境直接访问：

https://www.tldraw.com/

本地安装

使用 npm 安装：

npm install tldraw

创建 TypeScript 组件：

import { Tldraw } from 'tldraw'
import 'tldraw/tldraw.css'

export default function PersistenceKeyExample() {
return (

)
}

更多使用细节见官方文档：

https://tldraw.dev/quick-start

另外，tldraw 提供了 VS Code 扩展插件，在扩展市场搜索安装即可。

小结

tldraw 作为轻量级开源绘图工具，协作便利、界面简洁，适合需要嵌入白板能力的项目直接复用。