智慧樹圖

1.1 版本

1.2 應用場景

智慧樹圖是透過動態樹節點的形式，展示關鍵的維度指標資訊。可以極大豐富企業戰情室的視覺效果。智慧樹圖共有 2 種子類型，效果分別如下：

• 智慧樹圖-電子

• 智慧樹圖-模型

1.3 功能介紹

• 智慧樹圖的 2 種子類型配置和功能一致，只是展示時的視覺效果不同

• 支援自訂圖表樣式，包括樹的主題色、節點氣泡顏色、節點氣泡大小等

• 支援自訂是否開啟特效背景

• 支援圖表定時重新整理、圖形輪播、輪播觸發超級連結

• 不支援行動端

「智慧樹圖-電子」和「智慧樹圖-模型」的各項屬性設定方法完全一致，只是展示的風格不同。下面以「智慧樹圖-模型」為例，「智慧樹圖-電子」同理設定即可。

2.1 準備資料

點選設計器左上角「檔案>建立普通報表」，在報表左下方建立一個 內建資料集 ，用於智慧樹圖綁定資料。如下圖所示：

2.2 插入圖表

合併一片儲存格區域，插入圖表選擇「擴展圖表-其餘 > 智慧樹圖-模型」。如下圖所示：

2.3 圖表資料

選中圖表，點選「儲存格元素>資料」，綁定資料如下圖所示：

智慧樹圖可以綁定 2 個欄位，節點名稱必須設定；節點內容顯示在節點名稱下方，可選擇欄位也可設定為「無」。

節點名稱和節點內容的顯示位置固定不可設定。效果如下圖所示：

2.4 圖表樣式

下面對圖表預設樣式進行簡單介紹，可根據實際情況進行修改。

2.4.1 圖形

• 樹：主題色支援改變樹的整體顏色
  

• 氣泡：可以自訂樹的氣泡大小、顏色以及選中色

• 標籤：勾選欄位則顯示，支援修改顯示標籤內容的格式

• 字元：可以分別修改顯示標籤中「節點名稱」和「節點內容」的樣式，包括字體、字號、顏色等

本例僅修改「標籤>節點內容」格式為「百分比」即可。如下圖所示：

2.2.2 背景

• 流光效果：可選擇是否開啟樹幹中的流光動畫，預設開啟

• 齒輪效果：可選擇是否開啟樹根處的齒輪動畫，預設開啟

• 填充：設定圖表區填充背景

• 不透明度：設定圖表填充背景的不透明度

兩個動畫效果的位置如下圖所示：

2.5 圖表特效

• 重新整理：開啟定時重新整理後，每隔一段時間，重新載入資料並觸發樹節點圖的初始動畫

• 播放：開啟圖形輪播後，節點氣泡會輪播選中高亮狀態。如果開啟了觸發超連結且設定了超連結，輪播時還會自動觸發超連結

• 超級連結：支援圖表新增超級連結，實現圖表聯動傳參等效果

新增超連結時，參數值可選「節點名稱」和「節點內容」，節點名稱即 NODE_NAME ，節點內容即 NODE_VALUE 。如下圖所示：

2.6 效果預覽

儲存報表，點選 分頁預覽 ，效果如下圖所示：

前端預覽時，若未開啟「圖形輪播」，點選某個氣泡，該氣泡會一直保持高亮效果；點選非氣泡區域，可取消高亮效果。

如果開啟了「圖形輪播」，那麼點選氣泡後，輪播中斷；點選非氣泡區域，從上一次輪播中斷的地方繼續按照輪播間隔時間進行輪播。

點選下載範本：

智慧樹圖-模型.cpt

智慧模型-電子.cpt

4.1 節點展示不全

圖表展示區域設定的過小，而節點資料比較多時，可能出現節點不能完全展示出來的情況，例如：

資料集中有 4 個節點，如下圖所示：

而前端展示時顯示了前 3 個，如下圖所示：

此時如果想要在不改變區域大小的前提下，展示出所有節點，可以把節點氣泡調小一點

4.2 JAR 包依賴

擴展圖表插件 4.0 及之後版本依賴於%FR_HOME%\lib下以jxbrowser開頭的 2 個 JAR 包，如下圖所示：

如果缺少這 2 個 JAR 包，安裝擴展圖表 4.0 及之後版本，會有報錯：擴展圖表初始化失敗

如果使用者發現自己的設計器安裝目錄下缺少這 2 個 JAR 包，需要根據自己的系統下載 JAR 壓縮包，解壓後copy到目錄%FR_HOME%\lib下。

• Windows-32 使用者請下載：Win32 JAR

• Windows-64 使用者請下載：Win64 JAR

• macOS 使用者請下載：mac JAR