當前為10.0版本文檔,更多實例內容將在最新幫助文檔中展現,點選跳轉至 最新版幫助文檔

百分比刻度槽型儀表盤

 1. 概述

1.1 應用場景

百分比刻度槽型儀表盤是一個不完整的圓環,展示某一項的占比情況,有類别、百分比、數值等指标數據。

利用百分比刻度槽型儀表盤,可以直觀地表現出指标與達成數據的達成率,可以展示銷售完成率、産品合格率等,也可以作爲一個進度百分比展示。

它跟 百分比圓環儀表盤 的區别在於圓環采用了刻度槽樣式。效果如下圖所示:

1587892199295532.png

1.2 圖表特點

優點:直觀的表現出數據範圍與大小,某個指标的進度和完成情況,主要用於進度或占比的展現。

缺點:不能直觀的展示數據趨勢變化,不适用多種數據對比分析。

2. 屬性介紹

2.1 類型

以單元格元素或懸浮元素插入儀表盤後,可在右邊屬性面板的類型設置項下,選擇百分比刻度槽型儀表盤,如下圖所示:

2020-04-11_19-33-51.png

2.2 數據

基礎數據設置項詳細介紹可以參見文檔:圖表數據

分類名:百分比對應的分類名稱,前端展示時顯示在中間滑槽區域。

指針值:百分比計算時分子的一部分,要配合坐标軸下的最小值形成分子。

目标值:百分比計算時分母的一部分,要配合坐标軸下的最小值形成分母。

注:2020-07-06 及之後版本的 JAR 包新增指針值和目标值設置項。

Snag_3280e3a7.png

百分比計算公式:(指針值-最小值)/(目标值-最小值)

注:最小值指的是坐标軸處設置的最小值,詳情參見下面樣式的說明。

2.3 樣式

百分比刻度槽型儀表盤樣式設計的詳細介紹可以參見文檔:圖表樣式

1)百分比刻度槽型儀表盤的樣式>系列設置項跟基礎樣式有所不同,單獨介紹:

  • 配色:可以切換百分比刻度槽型儀表盤的色彩搭配,目前有 12 種,且支持自定義組合色和自定義漸變色。

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

  • 指針:此處控制指針的顔色,默認爲透明。

  • 刻度槽:此處控制圓環的刻度槽背景顔色,默認爲淺灰。

  • 半徑設置:控制百分比刻度槽型儀表盤的大小,分爲自動和固定兩種類型。

  • 滑槽占比:改變儀表盤中間滑槽區域的大小。

  • 刻度和配色:控制百分比刻度槽型儀表盤的刻度顔色。

Snag_25792f68.png

2)百分比圓環儀表盤的樣式>标簽設置項跟基礎樣式有所不同,下面單獨介紹:

百分比标簽和值标簽下的字号選擇自動,那麽字體會根據儀表盤大小自動調整大小。

1.png

百分比标簽下的顔色選擇自動,那麽百分比标簽的顔色會根據系列色顯示。

2.png

3)百分比刻度槽型儀表盤的樣式>坐标軸設置項跟基礎樣式有所不同,單獨介紹:

  • 自定義最小值:勾選後可以自定義最小值,默認不勾選。

  • 最小值:該值跟形成分子和分母有關系,詳情參見上面百分比計算公式。

注:2020-07-06 及之後版本的 JAR 包坐标軸有變動,只能設置最小值。

Snag_328b7642.png

2.4 特效

百分比刻度槽型儀表盤特效設置的詳細介紹可以參見文檔:圖表特效

注:百分比刻度槽型儀表盤的特效設置項下沒有條件顯示。

3. 示例

3.1 報表設計

3.1.1 數據準備

新建數據集 ds1,數據庫查詢語句如下:

select 類别名稱,sum(庫存量)as 庫存量 from 産品,類别

where 産品.類别ID=類别.類别ID and 類别名稱="飲料"

2020-04-20_21-59-01.png

3.1.2 組件設計

将百分比刻度槽型儀表盤拖拽到 body 組件中,調整位置,如下圖所示:

1587892256746676.png

3.1.3 數據綁定

百分比刻度槽型儀表盤的數據綁定方法如下圖所示:

Snag_32915e86.png

3.1.4 樣式設計

坐标軸設置項下勾選自定義最小值,設置最小值爲0,也可以不勾選自定義最小值,效果是一樣的。

Snag_32930234.png

3.2 效果預覽

1)PC 端

保存報表,點擊PC端預覽,效果如下圖所示:

Snag_a4b467e.png

2)移動端

1587892354382557.jpg

4. 模板下載

已完成模板可參見:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Primary\BasicChart\百分比刻度槽型儀表盤.frm

點擊下載模板:百分比刻度槽型儀表盤.frm

附件列表


主題: 原簡體文檔
已經是第一篇
已經是最後一篇
  • 有幫助
  • 沒幫助
  • 只是瀏覽

文 檔回 饋

滑鼠選中內容,快速回饋問題

滑鼠選中存在疑惑的內容,即可快速回饋問題,我們將會跟進處理。

不再提示

7s后關閉

反饋已提交

網絡繁忙