動態切換 web 報表中的統計圖類型

需求:瀏覽器

報表以圖形方式,也就是咱們常說的「圖表」形式展現時,不一樣的用戶對圖形類型有不一樣的要求,但願可以動態切換統計圖類型,例如實現柱形圖、條形圖、折線圖等圖形間的動態切換。函數

思路:性能

常見的作法是在報表中多個單元格中生成不一樣的統計圖,而後經過參數動態隱藏行來實現圖形類型切換,但此種方法須要製做大量的圖形圖表,工做量較大,並且大量隱藏單元格會耗用內存,在性能上也有必定影響。設計

固然,確定還會有別的方式……咱們在製做統計圖時會發現,絕大多數統計圖設置方式基本相似,只須要設置分類軸、系列便可生成統計圖。而生成的統計圖是經過單元格表達式中的 graph() 函數實現的,參考該函數的幫助文檔發現,該函數能夠傳入一個整型參數來控制統計圖類型,這樣咱們就能夠經過該參數實現統計圖類型間的動態切換。下面,咱們具體介紹下該種方式的實現。blog

一:製做統計表內存

以訂單表爲例,按貨主地區統計訂單數量,報表設計界面以下:文檔

1jpg

二:增長統計圖變量

A三、B3 單元格合併,並更改該行高度,在 A3 中設置統計圖:表單

2jpg

統計圖類型可任選,分類軸以及系列中設置相應表達式 ,點擊肯定便可。這樣該單元格就生成了一個柱形圖。方法

三:動態更改類型

報表中增長一個整數型參數:type,用於控制統計圖類型,默認值設成 7 表示默認圖形類型是柱形圖:

3jpg

將 A3 單元格的值表達式更改爲 graph(type)

這樣預覽報表給該參數傳遞不一樣的值該單元格就能展現不一樣的圖形類型。

四:頁面端控制

報表製做好後,可在頁面端增長一個參數表單進行動態控制。若是用戶只須要看圖形,可將報表的前兩行設置隱藏,而後將沒用的行列刪除,將報表保存爲爲 tu.rpx,並增長參數表單報表,設置以下:

4jpg

C1 單元格變量名屬性設置成:type,C1 可作爲下拉框供用戶選擇,值以下:

5jpg

將報表保存爲 tu_arg.rpx,在瀏覽器端訪問 tu.rpx,更改參數點擊查詢便可,如選擇折線圖:

6jpg

選擇柱形圖:

7jpg

附:各圖形類型對照關係:

1:區域圖

2:條形圖

3:三維條形圖

4:三維簇狀條形圖

5:堆積條形圖

6:三維堆積條形圖

7:柱形圖

8:三維柱形圖

9:三維簇狀柱形圖

10:堆積柱形圖

11:三維堆積柱形圖

12:折線圖

13:餅型圖

14:散列圖

15:三維區域圖

16:三維折線圖

17:三維餅型圖

18:時序狀態圖

19:時間走勢圖

20:雙軸折線圖

21:雙軸柱線圖

22:雷達圖

23:甘特圖

24:儀表盤

25:里程碑

相關文章
相關標籤/搜索