Uncaught TypeError: Cannot read property 'currentStyle' of null in ChartJS

问题:

I am using create ChartJS for create chart.And system provide facility to search data in date range. When searching new rage load chart corectly, but when focus to chart old chart values display again. To solve that remove previous canvas content and load new canvas using

$('#line').remove(); $('#chart_container').append('<canvas id="line"  height="600px" style="margin-top:20px;"  ></canvas>'); 

After that fix chart load properly, but browser console display bellow error

回答1:

This happens because the events (resize) are binded at creation and there is no check whether the canvas exists or not in the resize handler.

In order to prevent this issue, you can modify the resize function and insert the following line before everything else:

if( !this.canvas ) return; 

回答2:

You're removing the plugin as well as the old HTML element. Try re-iniciating the ChartJS library after appending the new HTML.

回答3:

Instead of removing the chart, you can update your datasets like this:

myChart.chart.config.data.labels = myNewLabelsArray; myChart.chart.config.data.datasets[0].data = myNewDataArray; myChart.update(); 

I remember having a lot of problems with old data displaying, and this is what fixed it for me. Not destroying, just updating.

文章来源: Uncaught TypeError: Cannot read property 'currentStyle' of null in ChartJS