也算用了很多种的画流程图的软件，但是 excalidraw 这个工具之前并没有使用过。今天就研究了一下这个工具。

excalidraw 绘制的流程图会有手绘感，手绘感天生会给人亲切感，放在文章中，会给文章增色不少。

excalidraw 的网址如下： https://excalidraw.com/

excalidraw 的基础用法就不说了，说下几个让我有点 exciting 的点：

双列表格自动成图表

我用 excel 创建了一个两列的表格

excalidraw 这些用法你肯定不了解_自动生成

复制到 excalidraw 的时候，直接弹出图表选项

excalidraw 这些用法你肯定不了解_流程图_02

选择其中一个，自动生成图表

excalidraw 这些用法你肯定不了解_字段_03

这个功能有几个要求：

  • 需要使用 excel绘制表格（我自己测试使用腾讯文档是不生效的）
  • 表格需要是 2 列的，且第一行是字段说明，第二列是数值

Mermaid至 Excalidraw

我目前绘制图表用的最多的就是 mermaid，mermaid 能支持流程图，时序图。在 excalidraw 中，你可以直接复制 mermaid 代码，就能生成对应的手绘图。

sequenceDiagram
    Alice->>John: Hello John, how are you?
    John-->>Alice: Great!
    Alice-)John: See you later!
  • 1.
  • 2.
  • 3.
  • 4.

生成如下：

excalidraw 这些用法你肯定不了解_流程图_04

曲线指针

我要将一个模块指向另外一个模块，这个指向的指针我希望是弯曲的，而不是古板的直线，那么我就可以使用指针的图标，直接使用鼠标点击途中经过的第一下，第二下。。。直到到目标后，点击 esc，就能确定这个曲线指针。

excalidraw 这些用法你肯定不了解_自动生成_05

excalidraw 这些用法你肯定不了解_自动生成_06

文字变图表

excalidraw 这些用法你肯定不了解_流程图_07

这是一个付费的 AI 功能，每天只能有 10 次尝试机会。但是使用起来绘制手绘流程图简直不要太爽。

如图，用中文表达方式描述就可以绘制出来模块流程图。

元素属性面板

我们右键能弹出元素属性面板，这里的 Stats&Element properties 能打开元素属性面板。

excalidraw 这些用法你肯定不了解_自动生成_08

这个面板可不是只能查看的，我们可以在上面直接进行编辑，有所见即所得效果。

excalidraw 这些用法你肯定不了解_字段_09

万能的素材库

在素材库中你一定能找到你所需要的各种有用的素材。

excalidraw 这些用法你肯定不了解_流程图_10

本地化

excalidraw 将它的免费功能全部都开源出来了。

 https://docs.excalidraw.com/docs/introduction/development

按照上述链接，可以直接在本地搭建一个 excalidraw。

我自己尝试过，很方便，甚至可以使用素材库的素材。

其他

excalidraw 有个问题，对中文支持不是很好，中文在上面并没有手绘化。

所以有人就使用 excalidraw 的开源版本修改了一个支持中文的项目： https://handraw.top/

如果对中文字体有强需求的可以使用这个项目。

总结

excalidraw 是个很好用的手绘图形绘制编辑器。