輪播條形圖

1.1 版本說明

1.2 應用場景

擴展圖表插件 4.4 版本柱形圖類新增一種子類型：輪播條形圖。

該圖表适用於大屏場景，可用於輪播展示多條數據的指标進度及排名信息，效果如下圖所示：

1.3 功能介紹

• 不支持條件屬性。

• 不支持自定義标簽樣式。

• 支持數據集和單元格兩種數據形式。

• 支持設置數據展示時的排列順序。

• 支持圖表聯動和組件刷新，詳細介紹參見文檔：擴展圖表組件刷新。

1.4 插件安裝

點擊下載插件：擴展圖表插件

設計器插件安裝方法參照：設計器插件管理

服務器安裝插件方法參照：服務器插件管理

1.5 圖表入口

圖表類型的擴展圖表-柱形圖類下新增輪播條形圖，可選擇插入到報表中。

2.1 數據

前端展示的進度（百分比）計算公式：指标值/目标值，如下圖所示：

目标值也可以設置爲自動，其計算邏輯爲：分類中指标值最大的那個，對應的進度爲1，其他分類的進度爲當前指标值/最大指标值。

排序方式的規則如下：

• 順序：按照進度（百分比）從大到小排列。

• 逆序：按照進度（百分比）從小到大排列。

• 原始：按照數據集中數據的實際順序排列。

2.2 樣式

樣式這裏我們只介紹下圖形的設置，其他幾個設置項跟通用圖表設置項相同。

圖形設置項處可改變圖形的顔色、柱寬、行間距、整屏顯示的數據條數。

2.3 特效

可設置輪播的形式、輪播間隔、定時刷新，其中輪播間隔最小值爲 4 秒，如下圖所示：

輪播形式中逐條輪播和整屏輪播的效果分别如下：

• 逐條輪播

• 整屏輪播

3.1 準備數據

新建普通報表，新建内置數據集，數據如下圖所示：

3.2 插入圖表

合并一片區域單元格，插入輪播條形圖，如下圖所示：

3.3 綁定數據

綁定數據集中的字段，排序方式選擇默認的順序，如下圖所示：

3.4 設置标簽

标簽勾選序号、分類名、進度，如下圖所示：

3.5 效果預覽

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

注：擴展圖表不支持移動端展示。

已完成模板可參見：%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Primary\BasicChart\輪播條形圖.cpt

點擊下載模板：輪播條形圖.cpt