部分可以。draw.io 可透過檔案層級的佔位符共用名稱,也能根據資料設定顏色,但其文件並未證實不同頁面上的複製圖形之間,名稱、顏色和連結會自動雙向同步。
對於 Mac 桌面上的工作,關鍵在於你要重新排列同一張圖表,還是要維護多個位置各自獨立的版本。套用版面配置會重新排列現有圖形;維護多個頁面則代表需要管理多組值和設定。以下工作流程只使用合成節點和有文件說明的編輯器功能。套用版面配置以重新排列圖表
你需要哪種同步方式?
假設三個矩形——Node A、Node B 和 Node C——分別以寬幅和直幅排列。你希望每個節點的名稱、填滿色和目的地連結都一致,但位置可以不同。這項需求包含幾種不同操作:
| 需求 | 有文件說明的方法 | 限制 |
|---|---|---|
| 改變現有圖形的排列方式 | 對目前的圖表套用版面配置 | 會重新排列現有物件,而非維護平行檢視 |
| 在不同頁面重複使用名稱 | 在標籤中參照檔案層級的自訂屬性 | 編輯共用屬性;直接編輯標籤是另一項操作 |
| 根據資料為圖形上色 | 使用頁面層級的樣式規則或支援的樣式佔位符 | 必須維護相符的資料和適用規則 |
| 讓重複圖形使用相同目的地 | 明確設定各圖形的連結 | 共用標籤不代表共用目的地 |
| 編輯任一副本並同步傳播全部三項屬性 | 引用的文件未說明完整工作流程 | 不要把複製頁面視為自動同步系統 |
這些區別來自文件所述的範圍:檔案屬性會在各頁面共用,樣式規則屬於個別頁面,而連結則儲存為圖形中繼資料。這些功能足以支援受控的維護流程,但並未證實多個副本會成為同一個可編輯物件。全域自訂屬性、使用樣式規則變更圖形樣式、編輯圖形中繼資料
只需改變排列方式時,使用同一組圖形
如果你一次只需要使用一種排列方式,請保留一張可編輯的圖表。這樣就不必實際維護相互對應的副本。draw.io 桌面版可在 macOS 上執行,因此這種做法不必將工作移至瀏覽器。離線執行 draw.io
建立三個矩形,並將 Node A 連接到 Node B,再將 Node B 連接到 Node C。先設定所需的標籤、顏色和連結,再調整位置。接著使用文件說明的版面配置指令:
- 開啟
Arrange > Layout。 - 選擇合適的版面配置,例如水平或垂直流程版面配置。
- 調整選項,然後按一下
Apply。 - 檢查結果。若排列方式不合適,按
Cmd+Z復原。
版面配置會處理現有圖形,並依據圖形間的連線計算位置。目前的版面配置文件也區分了只調整連接線路徑的功能,以及會移動圖形的版面配置。因此,重新排列相同物件,是改變呈現方式且不必建立另一組需要協調的屬性的支援做法。套用版面配置以快速整理圖表
有一項重要限制:依序套用不同版面配置,不等於切換已儲存的檢視。文件指出,版面配置是根據圖表目前的狀態計算,因此再套用另一種版面配置,未必能一致地重現先前的結構。如果你必須保留精確且可分別編輯的位置,請使用不同頁面,並採用下方的維護方式。套用版面配置以重新排列圖表
在各自獨立排列的頁面間共用節點名稱
若要同時保留寬幅和直幅版本,請將兩個頁面放在同一個檔案中。先建立名為 Wide 的頁面,之後複製該頁面,並將副本命名為 Tall。文件說明的頁面選單提供 Duplicate Page 和 Rename Page。複製頁面可提供初始排列方式;請明確設定共用標籤。在圖表中新增多個頁面
在檔案層級定義名稱
開啟 File > Properties,按一下 Edit Data,並新增以下示範屬性:
| 屬性 | 值 |
|---|---|
nodeAName |
Node A |
nodeBName |
Node B |
nodeCName |
Node C |
每個項目都使用 Add Property 新增,然後按一下 Apply。檔案屬性可在每個頁面使用。相較之下,未選取任何項目時按一下 Edit Data,定義的是目前頁面的屬性。這項差異決定了名稱能否在不同版面配置間共用。全域自訂屬性
讓標籤參照這些名稱
在第一個矩形上按 Cmd+M,啟用 Placeholders,然後按一下 Apply。將其標籤設為 %nodeAName%。在其他矩形上分別重複此操作,使用 %nodeBName% 和 %nodeCName%。啟用佔位符,並以百分比符號括住屬性名稱,是文件說明的標籤設定方式。在標籤和工具提示中使用佔位符
現在複製頁面,並重新排列副本。之後若要重新命名邏輯節點,請變更其檔案屬性。避免在圖形、容器或頁面上新增同名屬性:範圍更明確的屬性會覆寫檔案值。全域自訂屬性
可以將標籤視為共用名稱的參照。在這套工作流程中,請在檔案屬性中變更名稱,而不要以文字常值取代顯示的標籤。
保持顏色一致,但不要假設副本彼此連動
對於小型圖表,直接更新樣式通常就足夠。設定好一個矩形的樣式後,在 Style 索引標籤中按一下 Copy Style,選取另一個頁面上與之對應的矩形,再按一下 Paste Style。這會在執行指令時套用格式;之後若有變更,請再次操作。圖形和連接線的樣式必須分開複製。複製和貼上圖形與連接線的樣式
如果只想變更填滿色,請使用目標圖形上的 Fill 顏色控制項。複製整個樣式可能會套用超出預期的格式。變更圖形樣式
使用頁面規則建立可重複套用的配色慣例
若有多個重複節點,可以定義一項示範慣例:Node A 的所有呈現方式都使用藍色。使用 Cmd+M 和 Add Property,為每個對應圖形新增名為 nodeKey、值為 A 的自訂屬性。圖形和連接線都支援自訂屬性。編輯圖形中繼資料
在每個版面配置頁面上設定規則:
- 開啟
File > Page Setup,然後選擇Advanced。 - 按一下
Style Rules旁邊的Edit,再按一下Add Rule。 - 使用比較方式
=,並以值A比對屬性nodeKey。 - 選擇
Fill Color,選取藍色,然後按OK確認。
此規則會設定該頁面上相符圖形的樣式。每個頁面各自管理規則,而圖形複製到目的頁面時,會套用目的頁面的規則。在 Tall 頁面上重複設定此慣例;之後若要變更慣例,必須同時更新兩個頁面的規則。規則生效時,無法透過一般格式控制項變更受規則控制的樣式。使用樣式規則變更圖形樣式
目前的文件也支援透過 stylePlaceholders=1 使用動態顏色值,包括樣式片段 fillColor=%color%;stylePlaceholders=1;。這證明顏色可以隨資料變化,但並未證實複製圖形的所有內容(包括連結)都能同步。請將此方法視為明確設定填滿色或使用頁面規則的進階替代方式。AI 圖表生成樣式參考
分別設定連結並檢查目的地
新增第三個名為 Details 的頁面。在各版面配置中的 Node A 矩形上按右鍵,選擇 Edit Link,從頁面清單選擇 Details,然後按一下 Apply。如此便能為兩個矩形設定相同的明確目的地。頁面文件也指出,重新命名目的地頁面時,連結中的頁面名稱會自動更新。在圖表中新增多個頁面
僅憑共用名稱,無法確認目的地一致。文件說明的 link 屬於圖形的中繼資料,因此變更目的地時,請檢查兩個矩形。編輯圖形中繼資料
對於自訂動作連結,draw.io 說明了複製動作清單或複製所有儲存格中繼資料的方法。後者是在 Style 索引標籤中使用 Edit > Copy Data 和 Edit > Paste Data,也會複製標籤、工具提示和佔位符等其他中繼資料。只有在目標也應取得相同中繼資料組合時,才使用此操作。複製自訂連結和儲存格中繼資料
新增更多版面配置前先確認結果
請對這張合成圖表進行以下簡單驗收。它能區分共用值與仍需刻意維護的屬性:
| 檢查項目 | 預期結果 |
|---|---|
將檔案屬性 nodeAName 改為 Node A Revised |
兩個佔位符標籤都顯示更新後的名稱 |
移動 Tall 頁面上的矩形 |
預期的獨立排列仍可使用 |
| 在兩個頁面上套用藍色慣例 | 兩個對應矩形都顯示指定的填滿色 |
| 檢查每個矩形的連結 | 兩者都指向 Details |
| 變更預定的目的地 | 明確更新每個受影響的連結並加以檢查 |
如果標籤直接顯示 %nodeAName%,請檢查 Placeholders 是否已啟用,以及屬性名稱是否正確。如果只有一個標籤顯示意外的值,請檢查其圖形、上層物件和頁面屬性是否有覆寫值。這些是文件說明的佔位符和範圍疑難排解步驟。在標籤和工具提示中使用佔位符、全域自訂屬性
請勿以試算表重新整理工作流程取代這項 Mac 桌面工作。現行資料來源文件明確指出,draw.io 桌面版無法載入資料來源。文件也指出,重新整理必須手動執行,且範本的 # link 指示詞所提供的連結不會被使用。因此,這項功能無法提供所需的桌面同步結果。從 Google 試算表和 CSV 檔案填入資料並建立圖形
若一次只需使用一種排列方式,請保留同一組圖形並重新排列。若要長期保留多種版面配置,請使用共用名稱屬性、明確的配色慣例,以及分別維護的連結。如此可得到實用且可檢查的結果,同時清楚界定文件所述的限制:文件未證實複製圖形能成為所有三項屬性都可在任一處編輯並自動同步的系統。
來源
- 套用版面配置以重新排列圖表 — draw.io
- 套用版面配置以快速整理圖表 — draw.io
- 離線執行 draw.io — draw.io
- 在圖表中新增多個頁面 — draw.io
- 全域自訂屬性 — draw.io
- 在標籤和工具提示中使用佔位符 — draw.io
- 編輯圖形中繼資料 — draw.io
- 複製和貼上圖形與連接線的樣式 — draw.io
- 變更圖形樣式 — draw.io
- 使用樣式規則變更圖形樣式 — draw.io
- AI 圖表生成樣式參考 — draw.io
- 複製自訂連結和儲存格中繼資料 — draw.io
- 從 Google 試算表和 CSV 檔案填入資料並建立圖形 — draw.io