工作中总是少不了要画画图,不管是开发中绘制流程图,还是设计系统时画出架构图,一款趁手的工具总是少不了。今天我们就来聊聊画图的白板工具。
今天我们推荐的推荐的项目帮你画出手绘风的高颜值图表,目前在GitHub已超过66K Star,它就是:excalidraw
Excalidraw是一个虚拟白板应用,专门用于绘制类似手绘的图表。它提供了一个无限的、基于画布的白板,具有手绘风格,支持多种功能。
Excalidraw具备轻量级、易用、美观、安全、协作等能力,非常适合用于技术文章配图、思维导图、架构图、流程图等场景。Excalidraw 编辑器提供的能力包括:
下面是它的GitHub star历史,Excalidraw 在绘图工具圈里起步算是比较晚的,但是可以看出发展还是非常快的。
绘图工具还是很多,比如processon、PlantUML、Draw.io,之前我也一直在用Draw.io画图,来说说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里画图了。