當你看到這篇文章的時候,我相信你一定已經(jīng)知道legend屬性下的 selected:Boolean? 用來控制顯示隱藏折線圖,但是想實現(xiàn)通過checkbox 多選框自定義切換顯示隱藏還有一些難度。
發(fā)現(xiàn)已有解決方法是基于jq 或者js 獲取id? 不太靈活 ,也不適用于antd? 動態(tài)生成的多選框
注意:為了簡化代碼 引用了loadsh 庫!

Loadsh
解決方法如下:
1.

如圖所示
2. 注意:change方法中 獲取的e 是一個數(shù)組而不是我們需要的對象形式,需要進行轉化!

函數(shù)方法
注:_.assignIn() 該方法 是用于分配來源對象的可枚舉屬性到目標對象上。 來源對象的應用規(guī)則是從左到右,隨后的下一個對象的屬性會覆蓋上一個對象的屬性且它會遍歷并繼承來源對象的屬性
注: 聲明的 list 是獲取到所有多選框的值 類型:Array;傳入的e 是獲取被選中的多選框的值 類型:Array!
3.此時我們拿到的showObj 這個對象 已經(jīng)符合 selected的要求,直接賦值即可。注意:賦值后需要重新渲染,否則無效

在setOption之前賦值噢
此時。我們已經(jīng)實現(xiàn)了 多選框點擊 切換隱藏 折線圖。同理,餅圖也可以的
舉個例子:

思路如圖