1. 概述
1.1 版本
報表伺服器版本 | 插件版本 | HTML5 端行動端展現插件版本 | 功能變更 |
---|---|---|---|
11.0 | V1.5.7 | 11.0.37 | - |
11.0 | V1.7.2 | 11.0.87 | 新增「渲染模式」,渲染範本分為前端渲染和圖片模式 |
11.0 | V1.8.7 | 11.0.96 | 前端渲染模式適配行動端,僅支援 HTML5 |
1.2 應用場景
報表設計時為了便於分析資料,看到資料的趨勢、瓶頸、進度等資訊,往往希望儲存格中以進度條的形式來表現資料或等級。如下圖所示:
1.3 功能簡介
使用者可透過安裝「儲存格進度條」插件,將儲存格中的資料轉換為儲存格進度條效果。資料格式支援:整數、小數、百分比、¥** 格式。
注:使用者也可以透過藉助 HTML 來顯示進度條樣式,詳情參見:圖形化顯示資料(進度條/等級)
2. 插件簡介
2.1 插件安裝
點選下載插件:儲存格進度條
設計器插件安裝方法請參見:設計器插件管理
伺服器安裝插件方法請參見:伺服器插件管理
2.2 操作方法
安裝插件後,選中某個儲存格,在右側屬性面板選擇「儲存格屬性>形態>進度條」。使用者可設定進度條的屬性,如下圖所示:
使用者也可在條件屬性設定中選擇「形態>其他形態>進度條」,具體設定屬性與儲存格形態一致。如下圖所示:
2.3 使用場景
1)行動端支援顯示進度條形態。
2)範本存在「條件屬性」時:
PC 端不支援「分頁預覽」下顯示進度條形態,只支援「填報預覽」和「資料分析預覽」下顯示進度條形態。
行動端不支援「分頁預覽」和「資料分析預覽」下顯示進度條形態,只支援「填報預覽」下顯示進度條形態。
3)儲存格內容為公式時:
不勾選「填報/分析時保留公式用於計算」,支援顯示儲存格進度條。
勾選「填報/分析時保留公式用於計算」,只支援「分頁預覽」下顯示進度條形態。
4)列印匯出時,除匯出 Excel ,其他均支援列印匯出進度條形態。
5)FVS 表格組件 以及決策報表報表塊支援使用「儲存格屬性」顯示進度條形態,不支援使用「條件屬性」顯示進度條形態。
6)使用排程管理派送時,不支援使用儲存格進度條插件。
7)新計算引擎下不支援使用儲存格進度條插件。
3. 屬性簡介
使用者可設定進度條的各項屬性:「顏色、填充、底色、粗細、圓角、方向、最大數值、隱藏資料、處理負數」。
3.1 顏色
使用者可選擇進度條填充的顏色。設計器預設為「藍色」,如下圖所示:
3.2 填充
使用者可選擇進度條填充的效果:「漸變色」和「實心填充」。設計器預設為「實心填充」,如下圖所示:
3.3 底色
使用者可選擇進度條底部背景顏色,設計器預設為「灰色」,如下圖所示:
3.4 粗細
使用者可設定進度條的寬度,設計器預設為「0」,可設定大於 0 的任意值。如下圖所示:
3.5 圓角
使用者可設定儲存格的圓角尺寸,設計器預設為「0」,可設定大於 0 的任意值。如下圖所示:
3.6 方向
使用者可選擇進度條的展示方向:「從左到右」和「從右到左」,設計器預設為「從左到右」。如下圖所示:
3.7 最大數值
使用者可設定進度條填充滿所對應的數值。
1)預設:根據擴展出來的資料最大值來確定最長的進度條。
2)自訂:根據使用者自訂的數值來確定最長進度條,支援輸入整數型態、雙精度型、公式。
例如:儲存格擴展資料為銷售額 20-120 萬元
若選擇最大數值為「預設」,則按照最大銷售額 120 萬元為最長進度條填滿。
若選擇最大數值為「自訂」 80 萬元,則超過 80 萬元的資料的進度條均填滿。如下圖所示:
注:若儲存格為非擴展資料,必須指定最大值,否則所有進度條長度相同。
最大數值 | 差別 | 示意圖 |
---|---|---|
預設 | 僅最大值進度條填滿 | ![]() |
自訂 | 超過自訂值的進度條均填滿 | ![]() |
3.8 隱藏資料
使用者可選擇是否顯示進度條對應的資料。
1)預設不勾選「隱藏資料」,即顯示進度條和資料。
2)勾選「隱藏資料」,即預覽範本時,只載入進度條,不顯示儲存格資料。
如下圖所示:
3.9 處理負數
使用者可設定「忽略負數」或「自訂」負數顯示方式。
3.9.1 忽略負數
選擇「忽略負數」,則預覽時,負數不顯示進度條。如下圖所示:
3.9.2 自訂負數
選擇「自訂」時,使用者可設定負數顏色、負數填充、最小負數、分隔線位置、分隔線顏色,如下圖所示:
1)負數顏色:可設定負數儲存格進度條的顏色,與「3.1 節」設定方式一致。
2)負數填充:可設定負數填充為「漸變色」或「實心填充」,與「3.2 節」設定方式一致。
3)最小負數:可設定最小負數值為「預設」或「自訂」,與「3.4 節」設定方式一致。
4)分隔線位置:使用者可設定正負數分隔線的位置為「基於數值自動」或「儲存格中間」。
基於數值自動:預設選擇該項,此時,最小負數和最大正數的進度條都分別充滿儲存格;
儲存格中間:分隔線始終保持在儲存格正中間,進度條以「正、負數絕對值的最大值」充滿整個儲存格。其他儲存格以最大值為基準計算進度條的長度比例。
如下圖所示:
5)分隔線顏色:分隔線預設是「虛線」,顏色預設「黑色」。線型不可修改,使用者可修改分隔線的顏色。如下圖所示:
3.10 渲染模式
注:僅支援PC端的舊前端的普通報表,且儲存格內嵌元素如字體上下角標等,暫不支援前端渲染。
渲染模式分為前端渲染和圖片模式,其中前端渲染可選擇「動態展開」,勾選後進度條在載入時會出現動畫漸顯效果。
圖片範本和前端渲染模式的對比效果以及差異如下:
當範本存在大量進度條時,前端渲染模式下範本載入速度更快。
圖片模式的進度條放大後會有鋸齒狀,但前端渲染模式下放大後無鋸齒狀。
圖片模式的分隔線較粗,且間距較大,而前端渲染模式下分割線較細,間距較小。
注:11.0.31 及之後版本,前端渲染模式適配行動端,僅支援 HTML5。
4. 範本下載
4.1 顏色
點選下載範本:儲存格進度條插件-顔色.cpt
4.2 填充
點選下載範本:儲存格進度條插件-填充.cpt
4.3 底色
點選下載範本:儲存格進度條插件-底色.cpt
4.4 粗細
點選下載範本:儲存格進度條插件-粗細.cpt
4.5 圓角
點選下載範本:儲存格進度條插件-圓角.cpt
4.6 方向
點選下載範本:儲存格進度條插件-方向.cpt
4.7 最大數值
點選下載範本:儲存格進度條插件-最大值.cpt
4.8 隱藏資料
點選下載範本:儲存格進度條插件-隱藏資料.cpt
4.9 處理負數
4.9.1 忽略負數
點選下載範本:儲存格進度條插件-忽略負數.cpt
4.9.2 自訂負數
點選下載範本:儲存格進度條插件-自定義負數.cpt
5. 注意事項
5.1 儲存格背景色的影響
儲存格背景色會對儲存格中的進度條形態有影響,具體如下表所示:
儲存格進度條插件版本 | 儲存格背景 | 結果 |
---|---|---|
V1.5.0 之前 | 任意背景 | 不顯示進度條 |
V1.5.0 及之後 | 顏色背景 | 顯示進度條 |
非顏色背景,例如紋理、圖案、漸變色、圖片等 | 不顯示進度條 |
5.2 瀏覽器背景色的影響
複合式報表中,如在菜單欄「範本>範本Web屬性>瀏覽器背景>顏色」中設定了「瀏覽器背景色」,如下圖所示:
那麼進度條的背景色也會是瀏覽器的背景色,如下圖所示:
5.3 摺疊/展開按鈕對進度條的影響
當儲存格進度條所在行存在摺疊/展開的層級關係時,進度條的最大值如果選擇「預設」則以當前展示檢視表下的儲存格所在層級下的最大值為標準。如下圖所示:
若想避免此情況發生可以將「儲存格屬性>形態>進度條」中的「最大值」改為「自訂」即可,如下圖所示: