支持中文手写和多画布的Handraw

news2025/1/6 10:54:33

在这里插入图片描述

什么是 Handraw ?

Handraw 是支持中文手写和多画布的 Excalidraw 白板工具。

官网上项目名称还是 Excalidraw-CN,所以 Handraw 应该是基于 Excalidraw 二开的,特点是支持中文手写字体和多画布

在这里插入图片描述

官方也提供了免费使用的站点:https://handraw.top

什么是 Excalidraw ?

Excalidraw 是一款手绘风格流程图、示意图、架构图在线绘制工具,也可以作为会议画板使用,支持协同和端到端的加密。

Excalidraw 在两年前就介绍过,老苏还介绍过应用 Excalidraw 实现远程教学的 Edrys

文章传送门:开放式远程教学平台Edrys

构建镜像

如果你不想自己构建,可以跳过,直接阅读下一章节

官方提供了 Dockerfile ,但需要我们自己编。构建镜像的基本命令如下👇

# 下载代码
git clone https://github.com/korbinzhao/excalidraw-cn.git
  
# 或者加个代理  
git clone https://ghproxy.com/github.com/korbinzhao/excalidraw-cn.git
  
# 进入目录  
cd excalidraw-cn
  
# 构建镜像
docker build -t wbsu2003/handraw:v1 .

# 运行容器
docker run -d \
   --restart unless-stopped \
   --name handraw \
   -p 2213:80 \
   -e NODE_ENV=development \
   wbsu2003/handraw:v1

安装

在群晖上以 Docker 方式安装。

在注册表中搜索 handraw ,选择第一个 wbsu2003/handraw,版本选择 latest

在这里插入图片描述

端口

本地端口不冲突就行,不确定的话可以用命令查一下

# 查看端口占用
netstat -tunlp | grep 端口号
本地端口容器端口
221380

在这里插入图片描述

环境

可变
NODE_ENV设为 development

在这里插入图片描述

更多的环境变量,请参考 .env.production 文件或者 .env.development,地址分别是:

  • https://github.com/korbinzhao/excalidraw-cn/blob/master/.env.production

  • https://github.com/korbinzhao/excalidraw-cn/blob/master/.env.development

不过老苏怀疑这些参数,应该是需要本地编译才起作用的

命令行安装

如果你熟悉命令行,可能用 docker cli 更快捷

# 运行容器
docker run -d \
   --restart unless-stopped \
   --name handraw \
   -p 2213:80 \
   -e NODE_ENV=development \
   wbsu2003/handraw

也可以用 docker-compose 安装,将下面的内容保存为 docker-compose.yml 文件

version: "3.8"

services:
  handraw:
    image: wbsu2003/handraw
    container_name: handraw
    ports:
      - "2213:80"
    restart: on-failure
    stdin_open: true
    healthcheck:
      disable: true
    environment:
      - NODE_ENV=development

然后执行下面的命令

# 新建文件夹 handraw
mkdir -p /volume1/docker/handraw

# 进入 handraw 目录
cd /volume1/docker/handraw

# 将 docker-compose.yml 放入当前目录

# 一键启动
docker-compose up -d

运行

在浏览器中输入 http://群晖IP:2213 就能看到注册界面

在这里插入图片描述

中文手写

文字 --> 字体 --> 手写

MacOS 系统和 Windows 系统下中文手写字体不同,下面是 Windows 上的效果

在这里插入图片描述

多画布

在这里插入图片描述

其他功能可以参考 Excalidraw

文章传送门:支持手绘风格的白板Excalidraw

参考文档

korbinzhao/excalidraw-cn: Excalidraw-CN 是支持中文手写和多画布的 Excalidraw 白板工具。Excalidraw-CN is a whiteboard supporting Chinese hand draw font and multi-canvas based on Excalidraw.
地址:https://github.com/korbinzhao/excalidraw-cn

Handraw | 中文友好的手写效果白板工具
地址:https://handraw.top/

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/736727.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

ModaHub魔搭社区:向量数据库Zilliz Cloud插入 Entity教程

目录 开始前 插入单个 Entity 批量插入 Entity 准备数据 插入数据 写入操作 本文介绍如何将 Entity 插入到 Zilliz Cloud 集群中的 Collection。 Entity 是 Collection 中的基本数据单元。同一个 Collection 中的 Entity 具有相同的属性,这些属性共同定义在 Schema 中…

低代码开发平台助力解决企业开发效率问题

编者按:随着企业应用需求的不断增加,提高企业开发效率已经成为许多企业的目标。传统的开发方法显然不适用,开发平台通过可视化拖拉拽搭建等易用性和高扩展性可以帮助企业解决这个问题。 关键词:可视化开发、私有化部署、前后端分离…

设计模式--------行为型模式

行为型模式 行为型模式用于描述程序在运行时复杂的流程控制,即描述多个类或对象之间怎样相互协作共同完成单个对象都无法单独完成的任务,它涉及算法与对象间职责的分配。 行为型模式分为类行为模式和对象行为模式,前者采用继承机制来在类间…

飞控学习笔记-IMU姿态算法

扩展卡尔曼滤波算法 传感器融合算法 卡尔曼滤波算法 最小二乘法 毕卡逼近法 对上式进行泰勒展开 得到四元数各阶近似算法: 梯度下降算法 梯度下降 互补滤波算法 chatgpt解释: 互补滤波(Complementary Filter)算法是一种常用…

zk-IMG:对抗虚假信息

1. 引言 前序博客: ZKP图片授权——PhotoProof:proofs of permissible photo edits Daniel Kang等人2022年论文《ZK-IMG: Attested Images via Zero-Knowledge Proofs to Fight Disinformation》,在该论文中提供了一个简单的deep fake ima…

高级编程技巧之Python装饰器详解

概要 装饰器是Python中一种强大而灵活的编程技巧,它可以用于修改或扩展函数的行为,同时又不需要修改函数的源代码。本文将介绍Python中的装饰器的基本概念、使用方法以及高级技巧,帮助你从入门到精通装饰器的使用。 一、基本概念 在深入学习…

【面试必考点】这一次带你彻底学会this的指向问题

文章目录 前言一、this的指向问题1.1 全局中的this1.2 普通函数中的this1.3 定时器中的this1.4 事件处理函数中的this1.5 构造函数中的this1.6 构造函数静态方法中的this1.7 箭头函数中的this 二、修改函数中的this指向2.1 call2.2 apply2.3 bind 三、 this指向练习3.1 某小游戏…

【软件分析/静态分析】chapter6 课程08 指针分析(Pointer Analysis)

🔗 课程链接:李樾老师和谭天老师的: 南京大学《软件分析》课程08(Pointer Analysis)_哔哩哔哩_bilibili 目录 第六章 指针分析(Pointer Analysis) 6.1 为什么需要指针分析 6.2 指针分析的基本…

AMAT 工业输入输出模块0100-77037

W;① ⑧ 0 ③ 0 ① 7 7 7 ⑤ 9 AMAT 工业输入输出模块0100-77037 0100-76124 0100-71313 0100-71311 0100-71309 0100-71278 0100-71267 0100-71229 0100-71224 0100-20100 IGBT 和 IGCT 是四层器件,乍一看并没有什么不同。但是,当您“ 深入了解…

Spring Boot原理分析(三):IoC容器的继承层次

文章目录 一、Spring Ioc容器的继承层次1.BeanFactory2.ListableBeanFactory3.HierarchicalBeanFactory4.ApplicationContext 二、常用的ApplicationContext的实现类1.ClassPathXmlApplicationContext(基于XML配置)2.AnnotationConfigApplicationContext…

[Android]使用jni实现高斯模糊

1.高斯模糊的原理: 根据周边的像素值来确定自己的像素值,平均值,最大值,最小值,正太分布值 2.均值模糊blur 函数声明: CV_EXPORTS_W void blur( InputArray src, OutputArray dst,Size ksize, Point anc…

python绘制分组条形图

文章目录 数据导入多组条形图堆叠条形图 数据导入 我们经常会遇到对比多个统计量随时间变化的图像,比如想知道中国、美国以及欧盟最近几年GDP变化,如下表所示,单位是万亿美元。 中国美国欧盟201813.8920.5315.98201914.2821.3815.69202014.…

转换或是克隆的虚拟机无法联网,网络服务无法启动

新转换的虚拟机,无法联网,启动网络服务,报错: systemctl start network.service job for network.service failed because the control process exited with error code. 查看网络服务状态,systemctl status network…

SpringMVC 中的控制器如何处理文件上传

SpringMVC 中的控制器如何处理文件上传 Spring MVC 是一个基于 Java 的 Web 框架,它是 Spring 框架的一部分,提供了一系列的组件和工具,帮助开发人员构建 Web 应用程序。其中,控制器是 Spring MVC 中的核心组件之一,它…

SpringMVC 中的控制器如何返回 JSON 数据

SpringMVC 中的控制器如何返回 JSON 数据 SpringMVC 是一个基于 Spring 框架的 Web 框架,它提供了一种方便的方式来处理 HTTP 请求和响应。在 SpringMVC 中,控制器是用来处理请求的组件,它们负责接收请求、处理请求并返回响应。在本文中&…

三大城市分会场精彩呈现—2023架构·可持续未来峰会圆满收官!

2023年6月30日,由The Open Group主办的2023架构可持续未来峰会三大城市分会场成功举办,也代表着本次The Open Group半年度架构峰会圆满收官! 本次大会以“可持续未来”为主题,采用“13”,即北京主会场上海/成都/深圳三…

svg修改图标颜色

对于svg图标,想通过hover或者active 添加颜色,没有办法修改,解决办法: 1. 修改svg图片源 最开始的svg图标: 修改这个fill"currentColor" 要是要修改线条颜色就修改stroke属性: fill属性设置对象…

青岛大学_王卓老师【数据结构与算法】Week05_02_栈的定义和特点_学习笔记

本文是个人学习笔记,素材来自青岛大学王卓老师的教学视频。 一方面用于学习记录与分享, 另一方面是想让更多的人看到这么好的《数据结构与算法》的学习视频。 如有侵权,请留言作删文处理。 课程视频链接: 数据结构与算法基础…

这所985太好考了,专硕06方向仅刷一人,其余过线全收!

一、学校及专业介绍 东北大学(Northeastern University)位于辽宁省沈阳市,是中华人民共和国教育部直属全国重点大学。它是国家“双一流”建设高校、国家“211工程”和“985工程”重点建设高校,全国首批博士、硕士学位授予单位。 …

10.12UEC++/结构体和枚举

1.结构体: 定义: 类中创建对象; UE4中使用: 也可以定义一个结构体类型的变量: 结构体成员想要在细节面板中调整时,也需要每个都加上UPropPerty指令宏才可以: 此时该变量没有break功能&#xff0…