也算用了很多種的畫流程圖的軟體,但是 excalidraw 這個工具之前並沒有使用過。今天就研究了一下這個工具。
excalidraw 繪製的流程圖會有手繪感,手繪感天生會給人親切感,放在文章中,會給文章增色不少。
excalidraw 的網址如下:https://excalidraw.com/
excalidraw 的基礎用法就不說了,說下幾個讓我有點 exciting 的點:
雙列表格自動成圖表
我用 excel 建立了一個兩列的表格
複製到 excalidraw 的時候,直接彈出圖表選項
選擇其中一個,自動生成圖表
這個功能有幾個要求:
- 需要使用 excel繪製表格(我自己測試使用騰訊文件是不生效的)
- 表格需要是 2 列的,且第一行是欄位說明,第二列是數值
Mermaid至 Excalidraw
我目前繪製圖表用的最多的就是 mermaid,mermaid 能支援流程圖,時序圖。在 excalidraw 中,你可以直接複製 mermaid 程式碼,就能生成對應的手繪圖。
sequenceDiagram
Alice->>John: Hello John, how are you?
John-->>Alice: Great!
Alice-)John: See you later!
生成如下:
曲線指標
我要將一個模組指向另外一個模組,這個指向的指標我希望是彎曲的,而不是古板的直線,那麼我就可以使用指標的圖示,直接使用滑鼠點選途中經過的第一下,第二下。。。直到到目標後,點選 esc,就能確定這個曲線指標。
文字變圖表
這是一個付費的 AI 功能,每天只能有 10 次嘗試機會。但是使用起來繪製手繪流程圖簡直不要太爽。
如圖,用中文表達方式描述就可以繪製出來模組流程圖。
元素屬性皮膚
我們右鍵能彈出元素屬性皮膚,這裡的 Stats&Element properties 能開啟元素屬性皮膚。
這個皮膚可不是隻能檢視的,我們可以在上面直接進行編輯,有所見即所得效果。
萬能的素材庫
在素材庫中你一定能找到你所需要的各種有用的素材。
本地化
excalidraw 將它的免費功能全部都開源出來了。
https://docs.excalidraw.com/docs/introduction/development
按照上述連結,可以直接在本地搭建一個 excalidraw。
我自己嘗試過,很方便,甚至可以使用素材庫的素材。
其他
excalidraw 有個問題,對中文支援不是很好,中文在上面並沒有手繪化。
所以有人就使用 excalidraw 的開源版本修改了一個支援中文的專案:https://handraw.top/
如果對中文字型有強需求的可以使用這個專案。
總結
excalidraw 是個很好用的手繪圖形繪製編輯器。