数据被过滤chartJs时如何保持圆角?

2022-01-22 00:00:00 javascript chart.js

我想出了这个 JSFiddle:

I came up with this JSFiddle : https://www.jsfiddle.net/gcb1dyou which has rounded chartJs bar corners.Problem is when legend clicked to filter data,corners disappear like below

当我点击橙色标签时，你可以看到黄色条上的圆形边框消失了.

When I clicked orange label as you can see rounded border disappeared on the yellow bar.

var lastVisible = 0;
for (var findLast = 0, findLastTo = this._chart.data.datasets.length; findLast < findLastTo; findLast++) {
if (!this._chart.getDatasetMeta(findLast).hidden) {
  lastVisible = findLast;
  if (this._chart.data.datasets[findLastTo - 1].data[this._index] == 0) {
    lastVisible -= 1;
  }
}

}在这里，我尝试添加另一个 if 以使 lastVisible findLast-1 当数据被隐藏(图例单击)并且先前的索引为空但不起作用时

} Here I tried to add another if to make lastVisible findLast-1 when data is hidden(legend clicked) and previous index is null but didn't work

else{
          if(this._chart.data.datasets[findLastTo - 1].data[this._index] == 0){
            lastVisible=findLastTo-2;
          }
        }

我该如何解决这个问题?期待看到你的答案.

How can I solve this?Expecting to see your answers.

推荐答案

我通过动态计算数据集的深度解决了这个问题.感谢回答

I fixed this problem by calculating the depth of dataset dynamically.Thanks for answers

 var lastVisible;
  var datasetsLength = this._chart.data.datasets.length;
  this._chart.data.datasets.map((e,index)=>{
    lastVisible=datasetsLength-1;
    //to find the depth of datasets and get non-zero value
    for(var i=lastVisible;i>0;i--){
    if(!this._chart.getDatasetMeta(i).hidden){
      if(this._chart.data.datasets[i].data[this._index] != 0){
        lastVisible = i;
        break;
      }
    }
    } 
  })

相关文章