這篇文章重點介紹在線繪圖工具draw.io的使用方法。

draw.io(流程圖繪制工具) for Mac v24.5.1 蘋果電腦版

• 類型：平面設計
• 大?。?/span>133MB
• 語言：多國語言
• 時間：2024-06-08

查看詳情

1、draw.io簡介

draw.io在線繪圖工具是英格蘭一家公司開發(fā)的，該公司信條：為每個人提供免費、高質量的繪圖軟件。

這款工具無須注冊登錄，安全、開源、使用廣泛、且基于瀏覽器，免安裝。

可繪制：流程圖、思維導圖、組織結構圖、文氏圖、信息圖、樓宇平面圖、網絡圖、架構圖、電氣工程圖、UML圖等。

2、創(chuàng)建繪圖

在瀏覽器地址欄里輸入：draw.io，回車后，其自動導航到：app.diagrams.net

并彈出如下界面：

上圖是保存路徑選擇存儲在當前機器的設備中，“Create New Diagram”是新建圖，"Open Existing Diagram"是打開已存在的圖。

我們選擇新建圖，將會出現以下界面：

首先，選擇文件的保存格式，包括drawio自己的格式，png圖片格式，svg向量圖片格式、html文件格式和xml格式。

然后，我們輸入文件的名稱，注意不要把對應的后綴給刪掉，其次，我們選擇創(chuàng)建圖的類型，這里選擇“Blank Diagram”，空白圖，最后點擊“Create”（創(chuàng)建）按鈕。

點擊“Create”后，它會讓你選擇保存到你的電腦的具體位置和名稱。

點擊“確定”后，進入到如下的界面。

它基本包含菜單、工具欄，左側的圖形類別與選擇欄、右側的對象屬性設置欄、中間的工作區(qū)和底部的頁標簽等。

3、定制繪圖類別

在界面左下角，點擊“More Shapes...”可以設置你想要的圖形類別：

在彈出的“Shapes”界面的左側，你想繪制什么圖形，可以把其勾選上，然后在界面右下角點擊“Apply”（應用）即可。這里勾選上了UML。

在draw.io中提供的UML圖形如下：

4、設置畫布等信息

在繪圖前，我們可以對繪圖的一些信息進行設置。

在工作區(qū)空白處任意位置點擊一下，在右側出現如下的屬性設置欄。

4.1 Diagram選項卡

Diagram選項卡中，設置一些與繪圖圖形有關的內容。

（1）View

Grid設置是否顯示網格，默認是顯示的。Gride右側的數字用于指定網格的大小和網格線的顏色。

Page View設置繪圖區(qū)是否以頁視圖的形式顯示。Background用于設置背景色，默認為白色，如果去掉勾選，則保存的圖的背景是透明色。

Shadow用于設置圖形是否有陰影，下面是無陰影和有陰影的效果對比：

（2）Options

Connection Arrows用于設置當鼠標在圖形對象上停留時是否顯示箭頭導向指引。下圖是有箭頭導引的效果：

當鼠標在某一個箭頭上稍作停留時，該箭頭顏色變深，同時會出現該圖形可能能連接的圖形對象，這時在出現的圖形框中，點擊一個圖形，其自動會創(chuàng)建一個點擊圖形的對象，并從原圖形向新建圖形上繪制一個箭頭。

或者，在圖形的一個箭頭上，按住鼠標左鍵，鼠標這時會變成一個十字箭頭，然后鼠標可以移動到其它圖形上，這時松開鼠標時，就從原圖形到目的圖形上創(chuàng)建了一個箭頭。