使用场景

Autodesk使用tldraw构建其产品Forma的画布体验。

ClickUp在其项目管理工具中集成了tldraw的协作白板功能。

Craft.do利用tldraw为其用户提供了一个新的画布基础的协作平台。

产品特色

- React画布：tldraw画布及其所有内容都是React组件，使用常规HTML和CSS渲染。

- 高性能：支持创建、编辑和操作数千个对象，包括图像、交互组件和嵌入式内容，针对桌面、平板和移动设备进行了高度优化。

- 实时协作：通过tldraw sync实现实时协作，或使用自己的后端实现共享体验，内置支持协作编辑、实时光标、视口跟随和光标聊天。

- 媒体和更多：可以在画布上添加图像、视频甚至其他网站，粘贴URL创建交互式书签，导出图像和数据。

- 定制化：创建自定义元素、工具、交互和用户界面，使用运行时Editor API控制画布。

- 完美墨水：使用笔工具创建美观的压力敏感的自由手绘线条，由我们的虚拟墨水定制算法提供支持。

- 完美箭头：创建美观的箭头连接线，链接形状、笔记等。

使用教程

1. 安装tldraw包：在终端运行`npm install tldraw`命令。

2. 导入样式：在React应用中导入tldraw的CSS样式。

3. 渲染组件：在React组件中渲染Tldraw组件。

4. 开始使用：访问快速入门指南，开始使用tldraw SDK构建应用。

5. 浏览示例：查看tldraw提供的示例，了解如何实现特定功能。

6. 阅读文档：深入阅读tldraw的文档，掌握SDK的高级用法。

7. 社区交流：加入tldraw的Discord社区，与其他开发者交流经验和问题。

8. 反馈和支持：如果在使用过程中遇到问题，可以通过邮件联系tldraw团队获取帮助。