萬花筒圖表

1.1 應用場景

FineReport 豐富的圖表功能可以實現各式各樣的視覺化展示效果，但面對一些複雜的、需要設計工具或編程語言實現的進階圖形，也可以藉助圖表間的組合，實現出類似的效果。

本文將透過圖表組合實現如下圖所示的萬花筒圖表。

1.2 功能介紹

• 外圈展示系列名稱，滑鼠拖曳可旋轉外圈。

• 內圈展示系列值，滑鼠懸浮可查看系列名和系列值。

1.3 實現思路

• 外圈使用餅圖實現，以儲存格元素的方式插入，透過修改內徑實現圓環效果。
  

• 內圈使用雷達圖實現，以懸浮元素的方式插入，將其放置在圓環內實現內圈效果。

範例透過萬花筒圖表統計候選人票數的情況。

2.1 資料準備

建立普通報表，建立內建資料集「候選人票數統計」，表設計如下圖所示：

2.2 報表設計

2.2.1 外圈設計

1）合併 A1~I1 儲存格，在第一列輸入標題：候選人票數統計。合併 A2~I28 儲存格，插入餅圖。如下圖所示：

2）如下圖綁定餅圖資料。

3）餅圖樣式選擇「標題」，取消勾選「標題可見」。

4）餅圖樣式選擇「圖例」，取消勾選「圖例可見」。

5）餅圖樣式選擇「系列」，修改內徑佔比為 80%，開啟可旋轉功能。

6）餅圖樣式選擇「提示」，取消勾選「使用資料點提示」。

7）餅圖樣式選擇「標籤」，勾選使用標籤，值標籤使用「富文字」，選擇系列名和票數進行展示。如下圖所示：

8）餅圖屬性面板選擇「特效>互動屬性」，將工具欄的內容全部取消勾選，隱藏工具欄。

2.2.2 內圈設計

1）點選右側屬性面板「懸浮元素>新增元素>插入圖表」，插入一個堆積柱形雷達圖。

2）滑鼠右鍵按雷達圖，點選「樣式」，選擇「背景>顏色」，設定雷達圖背景色為「透明」。

3）如下圖綁定雷達圖資料資訊。

4）同餅圖樣式設定相同，取消勾選「標題可見」、取消勾選「圖例可見」。

5）雷達圖樣式選擇「坐標軸>極角軸」，軸標籤選擇「隱藏」。

6）雷達圖樣式選擇「坐標軸>極徑軸」，軸標籤選擇「隱藏」，值定義採用「統一計算」，勾選「自訂主刻度單位」，設定值為 5。

7）雷達圖樣式選擇「提示」，勾選「使用資料點提示」，文字勾選「系列名」和「值」。

8）雷達圖屬性面板選擇「特效>互動屬性」，將工具欄的內容全部取消勾選，隱藏工具欄。

9）右鍵雷達圖，點選「置於頂層」，滑鼠將雷達圖拖動到外圈的環內。最終效果如下圖所示：

2.3 效果預覽

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

注1：由於存在懸浮圖表，不支援行動端、FVS 視覺化看板和決策報表預覽，但 FVS 視覺化看板、決策報表中都可以用兩個圖表塊疊加。

注2：由於雷達圖和餅圖的柱形不匹配，故報表預覽時會出現柱形不對齊的情況，可以手動旋轉下外圈，對齊內圈柱形。

點選下載範本：萬花筒圖表.cpt  萬花筒圖表.fvs

4.1 外圈部分提示不懸浮

由於雷達圖為方形建模且範圍較大，故懸浮在外圈的環內時，會遮蓋掉部分餅圖的提示操作。