66K star!想画出高颜值的流程图,试试这个手绘风开源白板

工作中总是少不了要画画图,不管是开发中绘制流程图,还是设计系统时画出架构图,一款趁手的工具总是少不了。今天我们就来聊聊画图的白板工具。

今天我们推荐的推荐的项目帮你画出手绘风的高颜值图表,目前在GitHub已超过66K Star,它就是:excalidraw

excalidraw是什么?

Excalidraw是一个虚拟白板应用,专门用于绘制类似手绘的图表。它提供了一个无限的、基于画布的白板,具有手绘风格,支持多种功能。

Excalidraw具备轻量级、易用、美观、安全、协作等能力,非常适合用于技术文章配图、思维导图、架构图、流程图等场景。Excalidraw 编辑器提供的能力包括:

  • 免费且开源。
  • 无限的、基于画布的白板。
  • ✍️类似手绘的风格。
  • 黑暗模式。
  • ️可定制。
  • 图片支持。
  • 形状库支持。
  • 本地化(i18n)支持。
  • ️ 导出为 PNG、SVG 和剪贴板。
  • 开放格式 - 将图纸导出为.excalidraw
  • json 文件。
  • ⚒️ 多种工具 - 矩形、圆形、菱形、箭头、线条、自由绘制、橡皮擦...
  • ➡️ 箭头绑定和标记箭头。
  • 撤消/重做。
  • 缩放和平移支持。

下面是它的GitHub star历史,Excalidraw 在绘图工具圈里起步算是比较晚的,但是可以看出发展还是非常快的。

为什么用 excalidraw

绘图工具还是很多,比如processon、PlantUML、Draw.io,之前我也一直在用Draw.io画图,来说说excalidraw 对比同类的特点:

  • 手绘风:excalidraw主打的第一点就是手绘风格,从呈现来说,我个人觉得更好看一些。
  • 易于集成:excalidraw可以很容易的集成进你的app,也提供多种集成插件方便开发过程。
  • 快速上手:使用上和主流产品基本一致,可以无成本快速上手使用。
  • 协作:支持团队协作
  • 安全:支持端到端的加密,保障数据安全。

使用 excalidraw

在线环境

首先Excalidraw还提供了在线的环境方便用户快速上手,地址如下:https://excalidraw.com/

进入后直接就可以开始画图,连登录什么的都不需要,不扫码、不要验证码,真是要好评一个。

顶部的工具栏是可以直接按数字键来切换的,细节拉满。

也有一些小小的不适应,就是Draw.io的框里可以直接加文字,在这里是创建一个文本,我一开始还奇怪字怎么歪了。

点击右侧可以打开素材库,自己画的内容就是自己的素材,还可以去素材库添加素材

加了一些图标进来,还是用现成的素材省事。除了基本的素材,也有模版,可以自己翻一番。

可以将自己的画作保存下来,或者也可以分享给其他同伴来协同工作。怎么样我画图还不错吧,这个也是个模版。

自己部署

项目支持docker运行也支持源码运行:

源码的话,前提要确认已经安装好nodejs,接下来:

下载代码
git clone <https://github.com/excalidraw/excalidraw.git>安装
yarn启动
yarn start

现在可以打开http://localhost:3000并开始使用

docker的话:

可以在源码中构建docker image

docker build -t excalidraw/excalidraw .

也可以直接从dockerhub拉

docker pull excalidraw/excalidraw

总之获取镜像之后,启动就可以了。

docker run --rm -dit --name excalidraw -p 5000:80 excalidraw/excalidraw:latest

最后 excalidraw还提供了一个VScode 插件,可以直接在vscode里画图了。

项目信息

  • 项目名称:excalidraw
  • GitHub 链接:https://github.com/excalidraw/excalidraw
  • Star 数:66K+

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

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

redis优化系列(六)

本期分享redis内存过期策略&#xff1a;过期key的处理 Redis之所以性能强&#xff0c;最主要的原因就是基于内存存储。然而单节点的Redis其内存大小不宜过大&#xff0c;会影响持久化或主从同步性能。 可以通过修改配置文件来设置Redis的最大内存&#xff1a; maxmemory 1gb …

DophineScheduler通俗版

1.DophineScheduler的架构 ZooKeeper&#xff1a; AlertServer&#xff1a; UI&#xff1a; ApiServer&#xff1a; 一个租户下可以有多个用户&#xff1b;一个用户可以有多个项目一个项目可以有多个工作流定义&#xff0c;每个工作流定义只属于一个项目&#xff1b;一个租户可…

时空预测网络ST-Resnet 代码复现

ST-ResNet&#xff08;Spatio-Temporal Residual Network&#xff09;是一种用于处理时空数据的深度学习模型&#xff0c;特别适用于视频、时间序列等具有时空结构的数据。下面是一个简单的使用PyTorch搭建ST-ResNet的示例代码。请注意&#xff0c;这只是一个基本的示例&#x…

大模型微调实战笔记

大模型三要素 1.算法&#xff1a;模型结构&#xff0c;训练方法 2.数据&#xff1a;数据和模型效果之间的关系&#xff0c;token分词方法 3.算力&#xff1a;英伟达GPU&#xff0c;模型量化 基于大模型对话的系统架构 基于Lora的模型训练最好用&#xff0c;成本低好上手 提…

【项目日记(三)】内存池的整体框架设计

&#x1f493;博主CSDN主页:杭电码农-NEO&#x1f493;   ⏩专栏分类:项目日记-高并发内存池⏪   &#x1f69a;代码仓库:NEO的学习日记&#x1f69a;   &#x1f339;关注我&#x1faf5;带你做项目   &#x1f51d;&#x1f51d; 开发环境: Visual Studio 2022 项目日…

(酒驾检测、人脸检测、疲劳检测、模拟口罩数据集制作、防酒驾)-常用的论文所用的python代码总结

汇总&#xff1a; 学习感悟&#xff1a;如果小白建议一行一行的Debug,看够一定量的代码&#xff0c;自己就自然顺手写代码了。汇总上传的东西用在自己电脑上一般都需要适当修改的。 20&#xff0c;水平翻转图片 19&#xff0c;颜色空间装换HSV对比演示 18&#xff0c;光照补…

永赢基金引入微签电子签章系统实现审批签章电子化

永赢基金管理有限公司采用微签电子签章系统&#xff0c;作为进一步推动办公自动化转型的解决方案。微签在审批签署方面的显著优势&#xff0c;帮助永赢基金有效解决了原有OA系统无法满足电子文件全程电子化、签章不落地的问题&#xff0c;实现办公效率翻倍。 公司概况 永赢基金…

PaddleOCR实现对表格的提取

1、背景 PaddleOCR: 基于飞桨的OCR工具库&#xff0c;包含总模型仅8.6M的超轻量级中文OCR&#xff0c;单模型支持中英文数字组合识别、竖排文本识别、长文本识别。同时支持多种文本检测、文本识别的训练算法。对pdf/word里的表格中识别出有效信息具有重要意义&#xff0c;比如…

2. SpringBoot3 实战之用户模块接口开发

文章目录 开发模式和环境搭建开发模式环境搭建 1. 用户注册1.1 注册接口基本代码编写1.2 注册接口参数校验 2. 用户登录2.1 登录接口基本代码编写2.2 登录认证2.2.1 登录认证引入2.2.2 JWT 简介2.2.3 登录功能集成 JWT2.2.4 拦截器 3. 获取用户详细信息3.1 获取用户详细信息基本…

【QT+QGIS跨平台编译】之四:【libSSH2+Qt跨平台编译】(一套代码、一套框架,跨平台编译)

文章目录 一、libSSH2介绍二、文件下载三、文件分析四、pro文件五、编译实践 一、libSSH2介绍 libSSH2是一个开源的C函数库&#xff0c;用来实现SSH2协议。 SSH(Secure SHell)到目前为止有两个不兼容的版本——SSH1和SSH2。 SSH2避免了RSA的专利问题&#xff0c;并修补了CRC…

matlab 计算相位角

目录 一、功能概述1、相位角2、主要函数二、代码实现1、复数的幅值和相位2、FFT 相位三、参考链接一、功能概述 1、相位角 angle 函数采用复数

可视化 | 【echarts】多组条形图堆叠条形图(toolbox应用)

文章目录 &#x1f4da;js&#x1f407;整体框架&#x1f407;整体框架&#x1f407;option&#x1f407;字体大小设置总结 【echarts】渐变条形折线复合图 【echarts】金字塔图 【echarts】中国地图热力图 【echarts】气泡图 html和css同 【echarts】渐变条形折线复合图…