jeecg-boot 報表組——折線圖初始化顯示部分圖例,部分變灰


繪制折線圖的方法有很多,三大圖標庫:Echarts、Bizcharts、G2(AntV)

1、Echarts:https://echarts.apache.org

在legend下加selected為false,可直接隱藏折現,圖例變灰,點擊圖例,顯示折線。

 

 

 

2、Bizcharts:當我在jeecg-boot代碼中看到如下代碼時,我就以為用的是Bizcharts了

dv.transform({
type: 'fold',
fields: this.fields,
key: 'x',
value: 'y',
})
於是,我找到Bizcharts官網:https://www.bizcharts.net/product/bizcharts/demo/64
如下圖所示,加一個過濾的filter就好了,將不滿足條件的數據過濾掉,但是圖例仍在只是變灰了,點擊可顯示

 

 

 

 可是,當我在自己的代碼里改的時候,卻怎么也沒有效果。

例子1:無效

 

 

 

 

 例子2:無效

 

 

 

 

 

 后來,我看到 dv.transform({type: 'filter',……});也是一個過濾數據的方法。。嘗試了一下,效果是有的,把不符合條件的折線不顯示了,但是連同圖例也沒有了,圖例顯示且變灰才是想要實現的效果

 

 

 

 

 

 還是需要往jeecg-boot的本質入手呀,所以就查了文檔↓

3、viser(AutV/G2)

jeecg-boot開發文檔 https://www.kancloud.cn/zhangdaiscott/jeecg-boot/2043983

 

 

 

 

 

 看到例子后,恍然大悟,原來這里的寫法是大括號里套中括號。

代碼如下

 

 

 

 

最終效果展示

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM