js統計圖表工具FineReport教程：[7]儀表盤?

大家經常看到儀表盤，如汽車駕駛艙裡的儀表盤，FineReport報表可以輕鬆設計出儀表盤來展示用戶的數據，清晰的看出某個指標值所在的範圍，下面就通過js統計圖表工具FineReport來簡單介紹一下。

工具/原料

js統計圖表工具FineReport7.1.1

大小：148.2M 適用平臺：windows/linux

方法/步驟

如下圖庫存量儀表盤（庫存量低、正常、滿庫），圖中展示蘋果汁庫存量所在範圍，如果在低，則說明要補貨了，在高時要促銷：

以下我們來介紹一下這個儀表盤的製作方法。

數據準備

新建工作薄，添加數據集ds1，SQL語句為SELECT * FROM [產品] where 產品名稱 = '蘋果汁'，查詢出蘋果汁的庫存量。

注：該文檔僅以蘋果汁為例說明儀表盤的製作方法，實際情況下通常將產品名稱定義為參數，動態地顯示某個產品的數據。

插入儀表盤

以單元格圖表為例，合併一片單元格，右擊單元格元素>插入圖表，選擇儀表盤，如下圖：

點擊確定，在右側的圖表屬性表中選擇需要使用的儀表盤類型，FineReport提供了三種不同類型的儀表盤以供選擇，如下圖：

注：不同的儀表盤類型其樣式不一樣，設置方法也有所區別。

這裡直接使用默認的第一種類型。

設置圖表數據

設置圖表數據源，圖表數據直接來自於數據集，設置如下：

注：若分類值有多個的話，則一個分類對應一個儀表盤，顯示多個儀表盤。

儀表盤樣式

指針活動範圍

指針活動範圍是指，儀表盤顯示的角度，如果調整為270度，則儀表安會顯示四分之三個圓，如下圖：

這裡還是用默認的180。

儀表盤的單位設置

根據數據的不同，通常需要修改圖表盤的單位（默認為元），此修改為箱(24瓶)；

選中圖表，點擊上方圖表樣式>系列，在單位設置處改動，如下圖：

指針值及刻度值數量級

主要用於指針展示數據非常大時，用數量級表示數據，縮小儀表盤刻度值。

儀表盤刻度配色設置

儀表盤可根據刻度的大小來配置每個階段的顏色顯示，同時可自定義階段的個數以及階段的劃分方式，如下圖：

注：階段的劃分個數最多隻能劃分6個。

另：階段劃分不是指將刻度劃分為幾個範圍，而是指圖表配色劃分為幾個階段。

這裡選擇自動的配色方式。

標籤設置

儀表盤中可以顯示數值、單位以及分類名稱，點擊圖表屬性表-樣式>標籤即可對其進行設置，設置數值和單位的字體以及大小，確定是否顯示標籤等等，如下圖：

這裡不進行修改使用默認設置

保存與預覽

保存模板，點擊分頁預覽，效果即如上。