反饋已提交

網絡繁忙

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

C00-26 擴展圖表儀表板類

一、概述

  1. 儀錶板可以顯示指標的達成情況,通常會顯示指標的達成值、目標值和完成率。

  2. 擴展圖表提供了3種儀錶板:輪播夜光儀錶板、水球圖和輪播畫素點圖,他們通過不同的風格展示指標的達成情況。

  3. 區别於基礎圖表中的儀表盤,輪播夜光儀表盤擁有發光效果,一般用於大屏場景展示。

  4. 水球圖是填充儀表盤的一種,适合於展現單個百分比資料的圖表型別。一般用以於顯示利潤,回款等财務指标。

  5. 輪播畫素點圖適用於企業戰情室場景,可用於輪播展示多個百分比資料,也可以用於實時監測百分比資料變化,例如實時監視 cpu 和記憶體運作佔比。

二、插件安裝

  1. 點擊下載插件:擴展圖表插件

  2. 設計器插件安裝方法參見:A11-18 伺服器-插件管理

  3. 伺服器安裝插件方法參見:伺服器插件管理

三、屬性設定-輪播夜光儀錶板

1
功能介紹。
  1. 支援動態顯示百分比數值和儀表盤刻度。

  2. 支援調整圖形和背景的樣式。

  3. 支援自訂輪播間隔和圖表關聯。

  4. 支援圖表重新整理,設定方法參見文檔:擴展圖表組件重新整理

  5. 2020-07-06 及之後版本的JAR 包支援顯示負數百分比,百分比爲負數時不顯示進度條。

2
圖表入口。
  1. 圖表型別的【擴展圖表-儀表盤類】下新增夜光儀錶板,可選擇插入到報表中。

 

1.png

 

3
【樣式】。
  1. 樣式設定包括【圖形】、【背景】,【圖形】中內容的設定可參考C02-02 圖表標籤,【背景】的設定可參考C02-06 圖表背景

  2. 輪播夜光儀錶板特有樣式包括【圖形】→【區間設定】,可設定【區間顏色】。

  3. 【區間顏色】預設為【自動】,【自動】時根據值劃分為三段,【自訂】時,可根據劃分階段設定各階段顏色。

  4. 更改樣式設定,在瀏覽器中查看效果。

 

2.gif


3.png

 

4
範例。
  1. 建立普通報表,建立【資料庫查詢】,輸入SQL:select * from 銷量。

  2. 點擊【懸浮元素】→【資料】,進入資料綁定介面。

  3. 設定【資料來源】為【資料集資料】,【資料集】選擇剛新建的【ds1】。

  4. 【播放維度】選擇欄位【銷售員】,【指標值】選擇欄位【銷量】,【目標值】選擇【自動】。播放維度類似分類概念,【指標值】為分子,【目標值】為分母,【目標值】可自動計算出大小。

  5. 點擊【預覽】,在瀏覽器中查看效果。每個儀錶板展示對應銷售員名稱和該銷售員完成銷量占總銷量的百分比,不同銷售員的銷量儀錶板輪播展示。

 

4.gif


5.gif

 

四、屬性設定-水球圖

1
功能介紹。
  1. 支援資料動態輪播,資料可實時更新。

  2. 支援調整標題、標籤、圖形和背景的樣式。

  3. 支援自訂輪播間隔和圖表關聯。

  4. 支援圖表重新整理,詳細介紹參見文檔:擴展圖表組件重新整理

  5. 2020-07-06 及之後版本的JAR 包支援顯示負數百分比,百分比爲負數時不顯示水位。

2
圖表入口。
  1. 圖表型別的【擴展圖表-儀表盤類】下新增水球圖,可選擇插入到報表中。如下圖所示。

 

6.png

 

3
【樣式】。
  1. 樣式設定包括【標題】、【標籤】、【圖形】、【背景】,通用的設定可參考C02-00 圖表標題C02-02 圖表標籤C02-06 圖表背景

  2. 水球圖特有樣式包括【圖形】相關設定,可對區間和動畫進行設定。

  3. 【區間設定】可自訂區間數量、範圍和顏色,預覽後,百分比落在哪個區間,水波顯示為對應區間的顏色。

  4. 【波浪動畫】預設開啟,水球中水波有晃動效果,也可關閉。如下動圖1所示。

  5. 更改設定,在瀏覽器中查看效果。如下圖2所示。

 

7.gif


8.png

 

4
範例。
  1. 新增內建資料集【Embedded1】,具體可參考A03-01 內建資料集

  2. 點擊【懸浮元素】→【資料】,進入資料綁定介面。

  3. 【資料集】選擇剛新建的【Embedded1】。【指標值】選擇欄位【銷量】,【目標值】選擇欄位【目標銷量】。如下動圖1所示。

  4. 點擊【預覽】,在瀏覽器中查看效果。水球圖展示【指標值】對應【目標值】所佔百分比,水球中展示對應百分比的水容量。如下動圖2所示。

 

9.gif


10.gif

 

五、屬性設定-輪播畫素點圖

1
功能介紹。
  1. 支援資料輪播和定時重新整理。

  2. 圖表樣式支援設定標題、標籤、圖形、背景。

  3. 支援自訂輪播間隔,下限值爲4 秒。

  4. 支援顯示負數百分比,但沒有高亮的畫素圖形。

  5. 支援圖表關聯和組件重新整理,詳細介紹參見文檔:擴展圖表組件重新整理

2
圖表入口。
  1. 圖表型別的【擴展圖表-儀表盤類】下新增畫素點圖,可選擇插入到報表中。如下圖所示。

 

11.png

 

3
【樣式】→【資料】。
  1. 百分比的計算邏輯:【指標值】/【目標值】,【目標值】也可以設定爲【自動】,【自動】時預設給一個【目標值】參與運算。介面如下圖所示。

 

12.png

 

4
【樣式】→【圖形】。
  1. 【區間配置】:此處用於設定畫素點的顏色,不同百分比區間內畫素點顏色不同。可選擇【自動】或【自訂】設定。介面如下圖1所示。

  2. 【樣式】:此處可設定【畫素點個數】和【間隔】。當【畫素點填充】爲【單向填充】時,畫素點比例不變,會根據組件寬高,選擇某一方向填充滿,效果如下圖2所示;當【畫素點填充】爲【雙向填充】時,畫素點會橫縱向全部填充滿組件,效果如下圖3所示。

  3. 【動畫】:畫素點載入的動畫效果,可以選擇【正序】或【亂序】,效果分別如動圖4、動圖5所示。

 

13.png


14.png


15.png


16.gif


5
【樣式】→【特效】。
  1. 特效處可設定【定時重新整理】、【輪播間隔】、【輪播關聯】,介面如下圖所示。

 

18.png

 

6
範例。
  1. 準備資料:建立普通報表,建立【內建資料集】,如下圖1所示。

  2. 插入圖表:合併一片區域儲存格,插入【輪播畫素點圖】,如下圖2所示。

  3. 綁定資料:綁定圖表資料,配置如下圖3所示。

  4. 【配置區間】:①自訂區間和對應的畫素點顏色,②畫素點填充方式選擇【單向填充】,如下圖4所示。

  5. 儲存報表,點擊【分頁預覽】,效果如下動圖5所示。

  6. 注:擴展圖表不支援行動端。

 

19.png

 

20.png

 

21.png

 

22.png

 

23.gif

 

六、範本下載

附件列表


主題: 圖表應用
已經是第一篇
已經是最後一篇
  • 有幫助
  • 沒幫助
  • 只是瀏覽
  • 圖片不清晰
  • 用語看不懂
  • 功能說明看不懂
  • 操作說明太簡單
  • 內容有錯誤

文 檔回 饋

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

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

不再提示

10s後關閉