旧的 yAxis 刻度不会被删除chartjs、react-chartjs-2 包装器

如何解决旧的 yAxis 刻度不会被删除chartjs、react-chartjs-2 包装器

当我用 4 条线绘制图表时，每条线都有自己的数据 ofc，我以编程方式为具有 4 个 Yaxis 的 LineChart 创建选项，第一个在左侧，其余在右侧。现在，在绘制图表后，我从列表中取消选择一些数据源（要绘制的线更少），现在已经过时的 yAxis 刻度保留在那里，即使图表仅正确绘制了选定的线，并且选项更新为好正确。我想不出删除它们的方法！

我用谷歌搜索了 2 天，但找不到解决方案。我在函数式风格中使用 react ，它使事情变得更加复杂，因为每个建议似乎都是经典风格。 如果有帮助，我也在使用 react-chartjs-2 包装器。 我也很新来反应，并在 Stackoverflow 中询问，所以请让我放松一下:) 我假设图表正在重新渲染或其他原因，因为线条数量等确实发生了变化。

在图像中，console.log 中显示的“createYaxis”是选项对象的生成 yAxes 部分（否则会起作用）。问题 yAxises 以红色和黄色显示在右侧。图像显示前后情况。

img 下面的代码生成的options-object图片：

    var yAxisItems = [];
  function createYaxises (num){
    var arr = [];
for (var i=0;i<num.length;i++){
  
  if (i===0){
    arr.push({
 
          display: true,id: i,type: 'linear',position: 'left',gridLines: {
            display:false,//color: 'blue'
        },ticks: {
         fontColor: lineColourArray[i],fontSize: 14,}
           })
          }
        else {
          arr.push({
 
            display: true,position: 'right',gridLines: {
              display:false,//color: 'blue'
          },ticks: {
            display:true,fontColor: lineColourArray[i],}
      })
        }}
        yAxisItems = arr;
        console.log("createyaxis arr: ",arr);
        console.log("createyaxis: ",yAxisItems); //JSON.stringify(yAxisItems));
}

 //get data for selected sensors and set it to chart data 
  const handleGetSelectedSensorData = function () {
    
    var d = getSelectedSensorData();
 console.log("d: ",d);
    var dSets = [];
    if (d[0]){
      d.map((dItem,index)=> {
       var newDsetData =[];
       if (dItem.data){
          dItem.data.map((innerDataItem)=> {
            var dSet = {};
            dSet.x =  innerDataItem.timestamp;
            dSet.y = innerDataItem.v;
            newDsetData.push(dSet);
          })
        
        var newset = {
          data: newDsetData,label: dItem.sensorTag,borderColor: lineColourArray[index],fill: false,poinTradius: 1.5,backgroundColor:lineColourArray[index],borderWidth: 2,showLine: true,pointHoverRadius: 5,lineTension: 1,};
         
          dSets.push(newset);
      }}) 
 
      var dDataTemp = {};
      var optionstemp = new Object();
 
    dDataTemp.datasets =dSets;
    //create yaxises only once
   
 
    createYaxises(dDataTemp.datasets);
       //more than one set (Todo)
       //console.log("dDataTemp.datasets : ",dDataTemp.datasets)
        if (dDataTemp.datasets.length >1){
          console.log("dset > 1");
         
         for(var i=0;i< dDataTemp.datasets.length;i++) {
          dDataTemp.datasets[i].yAxisID = i;
            console.log("setting options");
      
            optionstemp ={
              tooltips: {
                enabled: true,intersect:false,mode:'x',callbacks: {
                title: function(tooltipItem,data) {
                  var toSplit = tooltipItem[0].label.split(",");
                  return (toSplit[0]);
                },label: function (tooltipItem) {
                  var split = tooltipItem.xLabel.split(',');
                    //return ( Number(tooltipItem.yLabel).toFixed(3));
                    return (split[2] + " : " + Number(tooltipItem.yLabel).toFixed(3)); 
                }
              },},hover: {
                mode: 'nearest',intersect: true,title:{
                  display:true,text:'Valittu sensoridata',fontSize:20
                      },legend:{
                    display:true,position:'right'
                  },scales: {
                     xAxes: [{
                      display: true,type: 'time',ticks: {
                      }
                    }],yAxes: 
                        yAxisItems
                    }
        }
          }
      setoptions(optionstemp);
      console.log("options: ",optionstemp);
      setdData(dDataTemp);
}}


    else {
      console.log("error in handleGetSelectedSensorData()");
    }
  }

线只是这样添加的：

<Line data={dData} options = {options} />

解决方法

而不是设置 #include <stddef.h> // for size_t #include <stdint.h> // for int32_t #include <string.h> // for memcpy void Fill(char* const arr,size_t const size,int32_t const value) noexcept { for (size_t i = 0; i + sizeof(value) <= size; i += sizeof(value)) memcpy(arr + i,&value,sizeof(value)); } set display: true，这将使轴消失，只要没有链接到该比例的数据集可见，只要链接到的数据集变得可见那个比例它会再次显示比例。

文档：https://www.chartjs.org/docs/master/axes/cartesian/#common-options-to-all-axes