前言

一些優秀的、清晰的技術文檔、技術博客、工作彙報都少不了一些流程圖、框圖、思維導圖等輔助說明圖片。大家平時在寫論文、寫文檔、寫博客、寫工作彙報都用什麼工具進行繪圖呢？

我平時寫博客、公眾號文章的一些框圖其實大都是用PPT軟體製作的，簡單快速。如果不習慣用其它的繪圖工具，PPT軟體其實也是一個不錯的繪圖選擇。

但是，前兩周我在做項目工作彙報文檔的時候是在Ubuntu環境下，Ubuntu下繪圖就沒那麼方便了，所以我只能去查找一些在線繪圖網站進行繪圖。

下面依次介紹幾款常用的、優秀的繪圖工具及我正在使用的、強烈推薦的繪圖工具。

幾種優秀的繪圖工具介紹

1、Draw.io

Draw.io 是 GitHub 上一個開源的流程圖繪製工具，功能很豐富。支持流程圖，UML圖，架構圖，原型圖等圖標。支持Github，Google Drive, One drive等網盤同步，並且永久免費。

在線網頁版地址：

但是，在線網頁版訪問會比較慢，如果覺得網頁版不方便，也可以選擇離線版的，Draw.io 也提供了多平台的離線桌面版可供下載。

離線版想要用起來，還需要一些配置。Draw.io是我正在用的，也是本文推薦的，所以下文也會介紹怎麼配置部署離線版Draw.io。

2、ProcessOn

ProcessOn是一個在線作圖工具的聚合平台，它可以在線畫流程圖、思維導圖、UI原型圖、UML圖、網路拓撲圖、組織結構圖等等，一個瀏覽器就可以隨時隨地的發揮創意，規劃工作。

ProcessOn有一定的限制，免費版只能在線保存 10 個文件：

但是，也基本可以能滿足我們平時的使用了。我上次做工作彙報的時候，需要做幾個框圖就是用這個做的，做完導出圖片即可，很方便。

3、ProcessFlow

ProcessFlow是仿照processOn基於drawio二次開發的，能夠保存流程圖到雲伺服器，百度網盤，gitee碼雲等雲端。在線預覽，管理，很方便。

這個工具是我偶然間發現的，我沒具體用來繪圖過，大家感興趣的話可以自己去體驗一下。

4、Visio

Visio大家應該都知道吧。Visio是一款非常好用的圖表繪製軟體，它可以幫助我們輕鬆繪製各種流程圖，包括常用的網路圖、組織結構圖、工程設計以及其他使用現代形狀和模板的內容，大大提高了用戶的工作效率。做Word文檔的話用Visio來作圖是一個很好的選擇，可以直接插入Visio對象，這樣看起來會清晰很多。

Draw.io 離線版部署

首先需要下載離線版Draw.io的draw.war包，下載地址：

溫馨提示：如果下載速度過慢也可以在本公眾號獲取（後台回復關鍵詞：Draw.io）。

War 包需要部署用到 Tomcat ，這裡我使用Tomcat8，下載地址：

溫馨提示：如果下載速度過慢也可以在本公眾號獲取（後台回復關鍵詞：Draw.io）。

我們把下載得到的draw.war包放到Tomcat的webapps路徑下：

然後雙擊
apache-tomcat-8.5.64-windows-x64bin目錄下的 startup.bat啟動tomcat。這時候可能會有兩種情況：

• 黑窗口一閃而過。
• 啟動成功。

啟動成功的界面如：

如果是一閃而過，那可能就是你的電腦還沒安裝jdk、沒配置相關環境變數。

安裝JDK，得到：

然後，添加jdk、tomcat環境變數：

配置好這些之後就可以成功啟動tomcat了。

打開瀏覽器訪問如下地址：

如果顯示如下界面：

則說明我們的離線版Draw.io基本已經部署好了。但是，這還不是真正的離線版，其還會訪問一些外部地址。

需要在tomcatwebappsdraw路徑下的index.html文件的urlParams 函數添加如下代碼：

result['offline'] = '1'  // 默認離線版

至此，我們就部署好了離線版的Draw.io。

資源下載

本篇筆記需要用到的資源我都打包好了：