Chartjs-Firefox is not responding when loading 800+ data sets in Bar Chart with Charts.Js

by

1👍

✅

Make sure that it’s actually Chart.js / Firefox that is causing the problem (try it out on other browsers, put a stopwatch right before you call new Chart... and stop it in onAnimationComplete)

While the following steps suggestion should logically reduce the number of calculations, I couldn’t see much difference (the chart rendering completes in 0.5 seconds on both IE and Firefox with animation turned off and 7-8 seconds with animation turned on for 800 datasets with 10 points each)

If you are aware of your data range (or if you can calculate this efficiently on the server side), you could override the scale and set your own scale

...
scaleOverride: true,
scaleSteps: 10,          // or whatever suits your dataset better
scaleStepWidth: 1,       // or whatever suits your dataset better
scaleStartValue: 0,      // or whatever suits your dataset better
...

It might also be a good idea to turn off tooltips if you haven’t done so (with 800 data sets, any tooltip you have is not going to be that useful)

...
showTooltips: false,
...

Leave a comment