Cannot read property 'transition' of null
See original GitHub issueIm trying to draw a line chart using ChartJs and Agular4 that takes data from @Input.
ngOnChanges(){
if(this.labelY && this.dataSet){
console.log(this.dataSet);
console.log(this.labelY);
setTimeout(()=>{
this.draw();
},500);
}
}
Without the timeout, error is generated. Any idea on resolving this issue?
Im using ChartJs 2.7.1 And Angular 4
draw(){
if (this.mychart) {
this.mychart.destroy();
}
let ctx = this.mycanvas.nativeElement.getContext('2d');
this.mychart=new Chart(ctx,
{type: 'line',
data: {
labels:this.labels,
datasets: this.dataSet
},
options: {
responsive: true,
elements: {
line: {
tension: 0 // disables bezier curves
}
},
scales: {
xAxes: [{
type: "time",
display: true,
scaleLabel: {
display: true,
labelString: 'Time'
},
ticks: {
major: {
fontStyle: "bold",
fontColor: "#FF0000"
}
}
}],
yAxes: [{
display: true,
scaleLabel: {
display: true,
labelString: this.labelY
},
ticks: {
min: 0, // it is for ignoring negative step.
beginAtZero: true,
stepSize: 1 // if i use this it always set it '1', which look very awkward if it have high value e.g. '100'.
}
}]
}
}
});
}
Issue Analytics
- State:
- Created 6 years ago
- Comments:19 (1 by maintainers)
Top Results From Across the Web
Cannot read property 'transition' null chartjs - Stack Overflow
I have a dynamic data that is need to be put inside a for loop in order to display the data of interest....
Read more >[Solved]-Cannot read property 'transition' null chartjs-Chart.js
Coding example for the question Cannot read property 'transition' null chartjs-Chart.js. ... Also, why cannot you loop within the constructor?
Read more >react cannot read properties of null - You.com | The AI Search ...
The TypeError: Cannot read properties of null (reading 'checked') comes because when you first render, your checkbox with that id isn't mounted to...
Read more >Chart.js: Uncaught TypeError: Cannot read property &#039
This problem is not caused by our product. There's something wrong with Charts or Moment libraries, that the moment is undefined error is...
Read more >Uncaught TypeError: Cannot read property of undefined
Out of the six primitive types defined in JavaScript, namely boolean, string, symbol, number, Null, and undefined, no other type throws as ...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
This error occurs when you just initialized the graph and overwrite the dataset almost immediately after you have initialized the graph (e.g., initializing the graph with empty dataset and sending an HTTP request to get a dataset from the server).
I was able to solve this error by completely disabling the animation in the options. My graph options:
I think this is a chart.js problem. If you do quick dataset replacement (i.e. remove then add new) during animation / transition, the exception will be raised. Occurs also for animation duration: 0