多指標儀表盤

1.1 應用場景

多指標儀表盤像一個鐘錶或者可讀盤，它有刻度和指標，其中刻度表示度量，指標表示維度，指標角度表示數值，指標指向當前數值。

利用多指標的儀表盤，可以直覺地表現出某個指標的進度或實際情況。效果如下圖所示：

1）多指標的儀表盤360度

2）多指標的儀表盤180度

1.2 圖表特點

優點：直覺地表現出某個指標的進度或實際情況，主要用於進度或佔比的展現。

缺點：只能一個維度，指標也不宜過多，展示資訊有限。

2.1 型別

以儲存格元素或懸浮元素插入儀表盤後，可在右邊屬性面板的型別設定項下，自由選擇前 2 種型別，如下圖所示：

2.2 資料

儀表盤資料綁定的詳細介紹可以參見文檔：圖表資料

2.3 樣式

儀表盤基礎樣式介紹可以參見文檔：圖表樣式

2.3.1 系列

儀表盤的樣式>系列有特殊設定，下面單獨介紹：

1）顏色

儀表盤刻度的配色方案，下拉可以選擇系統內建方案或者自訂方案，如下圖所示：

2）佈局

按分類名稱展示儀表盤時，會出現多個儀表盤，此時可以改變這些儀表盤的排列方向。

3）樣式

• 樞紐：選擇儀表盤中央樞紐的顏色。

• 樞紐背景：選擇儀表盤中央樞紐週圍的背景色。

• 指標：選擇指標的顏色。

• 底盤背景：選擇儀表盤整體的底盤背景色。

• 半徑設定：選擇自動即採用預設半徑；選擇固定，可自訂儀表盤的半徑。

4）範圍

儀表盤根據刻度值顯示儀表盤圓環的顏色：刻度和配色預設「自動」，取配色方案中前三種顏色，分別適配刻度 0~1/3，1/3~2/3，2/3~1 的區間色；選擇自訂時，可設定值屬於某個範圍顯示某個顏色。

2.3.2 標籤

儀表盤的樣式>標籤有特殊設定，下面單獨介紹：

值標籤下的字號選擇自動，那麼字體會根據儀表盤大小自動調整大小。

2.3.3 坐標軸

儀表盤的樣式>坐標軸有特殊設定，下面單獨介紹：

軸標籤的字號選擇自動，那麼字體會根據儀表盤大小自動調整大小。

軸標籤的顏色選擇自動，那麼軸標籤的顏色會根據系列色顯示。

2.4 特效

儀表盤特效設定參見文檔：圖表特效

3.1 報表設計

3.1.1 資料準備

建立資料集 ds1，資料庫查詢語句如下：

select 類別名稱,庫存量,訂購量,再訂購量 from 產品,類別

where 產品.類別ID=類別.類別ID and 類別名稱="飲料" 

3.1.2 組件設計

將 2 個多指標的儀表盤拖拽到 body 組件中，分別設定成 2 個不同的子型別，調整它們之間的位置關係，如下圖所示：

3.1.3 資料綁定

2 個子型別的資料綁定方法是一樣的，如下圖所示：

3.1.4 樣式設計

多指標的儀表盤的樣式只需要改個標題，其餘預設設定即可。

3.2 效果預覽

1）PC 端

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

2）行動端

已完成範本可參見：%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Chart\Dashboard\多指標的儀表盤.frm

點選下載範本：多指針的儀表盤.frm