圖表系統

3 min read

建立流程圖、 UML 圖、網路圖, 用智慧連接器連接任何視覺元素 .

! [數字流程圖] (…/images/diagram-flowchart.png)

概述

圖表系統提供:

數字元件 — 流程圖、 UML 和網路符號
Smart 連接器 — 元件移動時更新的自動路線箭頭
連接任何東西 — 連接任何畫布項目( 影像、文字、形狀、 SVG )
** 自动排列圖

存取圖片面板

點擊左邊工具列中的 Diagram 按鈕
圖片面板開啟顯示可用的元件

! [數字面板] (…/images/diagram-panel-shapes.png)

建立圖形元件

由小组提出

開啟圖片面板
選擇元件類別( Flowchart, UML, 網路, Basic)
點擊元件以加入畫布
拖曳到位置

元件類別

分類	元件	用途
流程圖	行程、決定、終點、資料、文件、資料庫	流程、工作流程
UML	類別、使用大小寫、角色	軟體圖
網路	云, 伺服器	建構圖
基本	矩形、圓形、三角形、星形	一般用途

連接項目

快速連接( 任何項目 )

選擇來源項目
按住 Shift 點擊目標項目
自動建立連結符

使用連接模式

在圖面( 或按 C) 點擊 Connect
點擊來源項目的端口( 藍圓 )
拖曳到目標項的端口
釋放以建立連結

! (…/images/diagram-connect-anything.png)

與任何項目一起工作

連接器不仅限于圖形連接 :

影像與匯入的 SVG
文字元素
自訂元件( 圓圈、星星、矩形 )
生成元件

連接器樣式

旋轉樣式

樣式	描述	最好的
直接	直線	簡單的連接
正弦	右角路徑	技術圖
曲線	平滑比齊爾曲線	有机布局

箭頭樣式

樣式	外觀
經典	填滿三角形
隱形	With
尖	長點
開啟	V 形大纲
鑽石	鑽石元件
圓形	填滿的圓圈
無	沒有箭頭

! (…/images/diagram-connector-styles.png)

自動拉尤特

自動排列您的圖 :

選擇要排列的元件( 或選擇不為所有 )
在圖片面板中點擊 Auto- Layout
選擇佈局算法

布局類型

布局	描述	最好的
分級	上下分層	流程圖、矩形圖
樹	父母-子女等级	家樹, 文件结构
放射	同心圓	注意地圖
网格	普通网格	库存、畫廊
強制指令	基于物理	網路圖示

[自动佈局] (…/images/diagram-auto-layout.png)

圖例

流程圖

[花圖] (…/images/diagram-flowchart.png)

簡單的流程圖 :

起始/ 結束的终端元件
動作的處理元件
成品鑽石
垂直連接器

網路圖

! (…/images/diagram-network.png)

顯示 :

網路的雲形
基础设施的伺服器元件
內部連接器

UML 使用大小寫

[UML圖] (…/images/diagram-uml-usecase.png)

使用大小寫圖:

角色棒形
使用大小寫
關聯連器

動畫連接器

新增動畫流的"bolt"效果:

選擇連接器
在屬性中啟用 Bolt 效果
調整設定值 :
- 彩色 — Bolt 顏色
- Speed — 動畫速度
- 大小 — Bolt 大小

螺栓沿連接器行走, 顯示數據流方向 .

提示

圖示提示 :

技術圖使用正交路徑
有机的、心智圖樣式使用曲線
加入所有元件後套用自動 Layout
拖曳到旋轉網格時按住 Shift

鍵盤捷徑

金鑰	動作
`C`	輸入連接模式
`Escape`	退出連接模式
`Delete`	刪除選取的連結符/ 元件