Chartjs-The dataset for bar graph is not set properly using ng2 charts and ng5-slider in Angular

by

0👍

✅

So I found the issue, but you will have to work a little bit on it to be fully functional.
it appears that when you set [datasets]="getBarChartData()" the chart is trying to render but is stuck in a loop because the value of the background color is infinitely changing inside getBarChartData(), note that you have a two way binding in your slider:

<ng5-slider [(value)]='value' [(highValue)]='highValue' [options]='options'>

and you can’t rely on that to properly update your chart.
What I did is, I added a valueChange event to the slider and update the chart whenever a value changes in the slider.

<ng5-slider (valueChange)="logValue($event)" [(value)]='value' [(highValue)]='highValue' [options]='options'>

I also added ngOnInit() to properly initialize dataValues
link to demo: link

Leave a comment