15.3K Star,超好用的开源协作式数字白板:tldraw
大家好,我是TJ
今天给大家推荐一个开源协作式数字白板:tldraw。
tldraw的编辑器、用户界面和其他底层库都是开源的,你可以在它的开源仓库中找到它们。它们也在NPM上分发,提供开发者使用。您可以使用tlDraw为您的产品创建一个临时白板,或者将其作为构建自己应用的工具来使用。
在线体验
tldraw的官方网站就是一个在线体验的demo,大家可以通过https://www.tldraw.com/直接访问进入体验。
可以看到界面非常的简洁,速度也非常快。
开发整合
如果你要把tldraw引入自己的应用中,非常简单,只需要通过类似下面的方法使用即可:
import { Tldraw } from '@tldraw/tldraw'
import '@tldraw/tldraw/tldraw.css'export default function () {return (<div style={{ position: 'fixed', inset: 0 }}><Tldraw /></div>)
}
您可以像上面这样使用<Tlraw>的React组件构建一个默认的tldraw白板。你也可以基于此,扩展自己需要的形状、工具和用户接口等。tldraw还提供了编辑器API以支持开发者对白板元素的创建、更新和删除。
具体详细的开发指南,可以前往官方提供的开发文档学习使用:https://tldraw.dev/
最后,老规矩奉上相关地址,感兴趣的小伙伴去深入了解一下吧:
- 官方网站:https://tldraw.com/
- 开源地址:https://github.com/tldraw/tldraw
欢迎关注我的公众号:程序猿DD。前沿技术早知道,弯道超车有希望!积累超车资本,从关注DD开始!
相关文章:
15.3K Star,超好用的开源协作式数字白板:tldraw
大家好,我是TJ 今天给大家推荐一个开源协作式数字白板:tldraw。 tldraw的编辑器、用户界面和其他底层库都是开源的,你可以在它的开源仓库中找到它们。它们也在NPM上分发,提供开发者使用。您可以使用tlDraw为您的产品创建一个临时…...
MGR新节点RECOVERING状态的分析与解决:caching_sha2_password验证插件的影响
起因 在GreatSQL社区上有一位用户提出了“手工构建MGR碰到的次节点一直处于recovering状态”,经过排查后,发现了是因为新密码验证插件caching_sha2_password导致的从节点一直无法连接主节点,帖子地址:(https://greatsql.cn/threa…...
git merging两边都被删除的文件
1. 场景: merge 另一个分支到当前分支,解决完冲突列表中的冲突后,发现项目任然在 merging 中,无法进行git下一步操作。 2. 原因: 通过 git status 发现一个文件,显示表面,该文件在当前分支和…...
项目--苍穹外卖
1.| constant | 存放相关常量类 | | context | 存放上下文类 | | enumeration | 项目的枚举类存储 | | exception | 存放自定义异常类 | | json | 处理json转换的类 | | properties | 存放SpringBoot相关的配置属性类 | | result | 返回结果类的封装 | | utils | 常用工具类 | …...
从零开发短视频电商 使用Spring WebClient发起远程Http调用
文章目录 依赖使用创建WebClient实例创建带有超时的WebClient实例示例 请求准备获取响应 高级过滤器自定义过滤器 自定义线程池自定义WebClient连接池开启日志错误处理最佳实践 示例异步请求同步请求上传文件重试过滤错误错误处理 参考 Spring WebClient 是 Spring WebFlux 项目…...
Python实现成语接龙
如图: 详细代码实现: # coding:utf-8 import string import pypinyin import sys import randomprint("初始化中,请稍等……")def main():f2 open(./idiom.txt, r, encodingutf-8)f f2.read() # 一次性读取完成new3_list f.sp…...
继续上一个爬虫,所以说selenium加browsermobproxy
继续,书接上回,这次我通过jsrpc,也学会了不少逆向的知识,感觉对于一般的网站应该都能应付了。当然我说的是简单的网站,遇到那些混淆的,还有那种猿人学里面的题目,还是免谈了。那种需要的水平太高…...
Sentinel服务熔断和流控
Sentinel服务熔断和流控 简介 Sentinel 随着微服务的流行,服务和服务之间的稳定性变得越来越重要。Sentinel 是面向分布式服务架构的流量控制组件,主要以流量为切入点,从限流、流量整形、熔断降级、系统负载保护、热点防护等多个维度来…...
01_TMS320F28004x系列MCU介绍和资料搜集
1. TI C2000 实时微控制器 TI公司在处理器方面的产品线有:基于ARM内核的微控制器/微处理器、MSP430微控制器、C2000系列实时微控制器、还有数字信号处理器(DSP)。 其中,C2000是TI公司专门针对实时控制推出的32位微控制器。TI公司…...
JavaScript中获取对象属性的不同方法
JavaScript中获取对象属性的不同方法 文章目录 JavaScript中获取对象属性的不同方法一、点记法二、方括号记法三、Object.keys()方法四、Object.values()方法五、Object.entries()方法六、Object.getOwnPropertyNames()方法七、Object.getOwnPropertyDescriptors()方法 JavaScr…...
【STM32教程】第四章 STM32的外部中断EXTI
案例代码及相关资料下载链接: 链接:https://pan.baidu.com/s/1hsIibEmsB91xFclJd-YTYA?pwdjauj 提取码:jauj 1 中断系统 1.1 中断的概念 中断系统的定义:中断是指在主程序运行过程中,出现了特定的中断触发条件…...
力扣第40天----第121题、第122题
# 力扣第40天----第121题、第122题 文章目录 一、第121题--买卖股票的最佳时机二、第122题--买卖股票的最佳时机II 一、第121题–买卖股票的最佳时机 分2种情况考虑,根据持有股票、不持有股票这2种情况,完成递推公式。另外,这里要求只买卖…...
Flask 使用 JWT(二)
在 Python 使用 JWT 主要的方案是 PyJWT 工具。 安装与基本使用 可以使用 pip 安装 PyJWT: $ pip install pyjwt编码与解码 编码函数 def encode( self, payload: Dict[str, Any], # payload 参数 key: str, …...
从0到1理解ChatGPT原理
目录 写在前面 1.Tansformer架构模型 2.ChatGPT原理 3.提示学习与大模型能力的涌现 3.1提示学习 3.2上下文学习 3.3思维链 4.行业参考建议 4.1拥抱变化 4.2定位清晰 4.3合规可控 4.4经验沉淀 机械工业出版社京东自购链接 写在前面 2022年11月30日,ChatG…...
如何解决 “Component cannot be used as a JSX component“
原因是react版本与types/react版本不一致导致的, 在tsconfig.json中加入以下代码,将依赖指向项目里的node_modules "paths": {"react": [ "./node_modules/types/react" ]}改完后代码大概是长这样的 {"compilerOptions": {..."…...
小程序自定义tabbar
前言 使用小程序默认的tabbar可以满足常规开发,但是满足不了个性化需求,如果想个性化开发就需要用到自定义tabbar,以下图为例子 一、在app.json配置 先按照以往默认的形式配置,如果中间的样式特殊则不需要配置 "tabBar": {&qu…...
分布式系统第五讲:分布式事务及实现方案
分布式系统第五讲:分布式事务及实现方案 事务是一个程序执行单元,里面的所有操作要么全部执行成功,要么全部执行失败。而分布式事务是指事务的参与者、支持事务的服务器、资源服务器以及事务管理器分别位于不同的分布式系统的不同节点之上。本…...
算法通关村17关 | 透析跳跃游戏
1. 跳跃游戏 题目 LeetCode55 给定一个非负整数数组,最初位于数组的第一个位置,数组中的每个元素代表你再该位置可以跳跃的最大长度,判断你是否能够达到最后一个位置。 思路 如果当前位置元素如果是3,我们无需考虑是跳几步&#…...
ARM接口编程—RTC(exynos 4412平台)
RTC简介 RTC(Real Time Clock)即实时时钟,它是一个可以为系统提供精确的时间基准的元器件,RTC一般采用精度较高的晶振作为时钟源,有些RTC为了在主电源掉电时还可以工作,需要外加电池供电。 RTC内部原理 RTC寄存器 RTC控制寄存器 …...
数据分享|WEKA信贷违约预测报告:用决策树、随机森林、支持向量机SVM、朴素贝叶斯、逻辑回归...
完整报告链接:http://tecdat.cn/?p28579 作者:Nuo Liu 数据变得越来越重要,其核心应用“预测”也成为互联网行业以及产业变革的重要力量。近年来网络 P2P借贷发展形势迅猛,一方面普通用户可以更加灵活、便快捷地获得中小额度的贷…...
腾讯地图SDK隐私协议合规接入实战:你的App真的合法显示地图了吗?
腾讯地图SDK隐私合规实战:从法律条文到代码落地的全流程指南 当你的App因为地图功能被应用商店拒审时,当用户投诉你的应用"偷偷收集位置信息"时,当合规团队发来长达20页的整改清单时——这些场景正在成为移动开发者的日常。去年某社…...
技术赋能B端拓客:号码核验行业的革新与实践,氪迹科技法人号码核验系统,阶梯式价格
2026年,随着B端市场竞争的持续加剧,“精准获客、降本增效”已从行业口号转变为企业生存发展的核心诉求,号码核验作为B端拓客全流程的前置关键环节,其服务质量直接决定了拓客效率、人力效能与投入回报比,成为影响企业拓…...
Carla仿真引擎报错‘Signal 11’?别慌,手把手教你排查UE4显存爆满问题
Carla仿真引擎报错‘Signal 11’的终极排查指南:从崩溃日志到显存优化 当你满心期待地启动Carla仿真环境,准备开始自动驾驶算法的测试时,屏幕上突然跳出一串令人窒息的红色错误信息:"Engine crash handling finished; re-ra…...
解决设计开发断层:Figma Code Connect的7个革新性实践
解决设计开发断层:Figma Code Connect的7个革新性实践 【免费下载链接】code-connect A tool for connecting your design system components in code with your design system in Figma 项目地址: https://gitcode.com/GitHub_Trending/co/code-connect 设计…...
UniApp项目实战:用UTS插件实现安卓后台保活(附完整Service配置与权限处理)
UniApp安卓后台保活实战:UTS插件与Service优化全解析 在移动应用开发中,后台任务保活一直是开发者面临的棘手问题。想象一下:你的UniApp应用需要持续获取用户位置、实时推送消息或播放音乐,却频繁被系统清理,用户体验直…...
Catime终极指南:3个技巧让你成为Windows番茄时钟大师
Catime终极指南:3个技巧让你成为Windows番茄时钟大师 【免费下载链接】Catime A very useful timer (Pomodoro Clock).[一款非常好用的计时器(番茄时钟)] 项目地址: https://gitcode.com/gh_mirrors/ca/Catime Windows番茄时钟、桌面倒计时工具和时间管理软件…...
LangChain4j向量化实战避坑:OpenAI、本地模型、Qdrant选哪个?我的踩坑记录
LangChain4j向量化实战避坑指南:OpenAI、本地模型与Qdrant的深度抉择 当Java开发者尝试构建基于大语言模型的应用时,LangChain4j框架中的向量化组件往往成为技术栈选型的第一个分水岭。我在三个实际项目中分别尝试了不同组合方案后,发现每个…...
智能管控硬件设备:FanControl散热管理工具全攻略
智能管控硬件设备:FanControl散热管理工具全攻略 【免费下载链接】FanControl.Releases This is the release repository for Fan Control, a highly customizable fan controlling software for Windows. 项目地址: https://gitcode.com/GitHub_Trending/fa/FanC…...
Flappy Bird AI训练避坑指南:为什么你的DQN模型总是‘撞墙’?
Flappy Bird AI训练避坑指南:为什么你的DQN模型总是‘撞墙’? 在强化学习领域,Flappy Bird这个小游戏因其简单的规则和复杂的决策过程,成为了检验算法效果的经典测试平台。然而许多开发者在尝试用DQN(深度Q网络&#x…...
lychee-rerank-mm快速上手:3步完成图库重排序(输入描述→上传图片→点击排序)
lychee-rerank-mm快速上手:3步完成图库重排序(输入描述→上传图片→点击排序) 1. 项目简介 lychee-rerank-mm是一个专门为RTX 4090显卡优化的智能图片排序工具。它能帮你从一堆图片中快速找出与文字描述最匹配的那些图片,就像有…...
