本文最后更新于 2024-06-24，

若内容或图片失效，请留言反馈。部分素材来自网络，若不小心影响到您的利益， 请联系我 删除。

本站只有Telegram群组为唯一交流群组， 点击加入

文章内容有误？申请成为本站文章修订者或作者？ 向站长提出申请

介绍

tldraw是一款免费的绘图和图表工具，具有手绘风格和智能箭头、捕捉和便签等便捷功能，可以导入本机图片，绘图后也可以导出各种图片格式。

使用的v1版本制作的镜像，不过也够用了🤔

项目支持中文（右下角点击问号修改），支持英文、符号、数字手写体，不支持中文手写体。

自托管不支持多人项目，可以用官方的。

GitHub地址-v1：tldraw/tldraw-v1: A tiny little drawing app. (github.com)

GitHub地址-v2：tldraw/tldraw: a very good whiteboard (github.com)

官网：tldraw

更好的docker镜像：ratneo/tldraw - Docker Image

从A tiny little drawing app变成了a very good whiteboard🥳

预览

1719170116381.webp
1719170119525.webp

下面这张是官网做的，字体不一样。

1719170129767.webp

部署

x64架构可跳过构建镜像阶段直接运行

构建镜像

# 下载代码git clone --depth=1 https://github.com/tldraw/tldraw-v1.git# 进入目录cd tldraw-v1/apps/www/

创建Dockerfile文件

FROM node:16-alpineWORKDIR /appCOPY . .RUN yarn && yarn buildFROM alpine:latestRUN apk add --no-cache yarnWORKDIR /appCOPY --from=0 /app/public ./public    COPY --from=0 --chown=nextjs:nodejs /app/.next ./.next    COPY --from=0 /app/node_modules ./node_modules    COPY --from=0 /app/package.json ./package.jsonCMD ["yarn","start"]

# 构建镜像docker build -t tldraw .

运行

docker run -d --name tldraw -p 3445:80 ratneo/tldraw

ip:3445可打开界面
可以自行修改容器名、端口、启动策略等参数，若使用自己构建的镜像一并修改镜像。

反向代理

参考教程：安装及使用

⚠️Nginx Proxy Manager（以下简称NPM）会用到80、443端口，所以本机不能占用（比如原来就有Nginx）

互联网使用请确保完成了域名解析