search

reactjs / react-chartjs

common react charting components using chart.js
MIT License
2.93k stars 300 forks source link

Is it possible to skip labels in a line chart if i have a large amount of data in react-chartjs1.2.0 #215

Open balgopal14 opened 6 years ago

balgopal14 commented 6 years ago

I have over 500 data points to show in a line chart. But there is not enought space to show a label for each data point. The labels are sorted dates on x-axes and price on y-axes . so I need a option that defines to show only each 4th, 5th, ... label on the x-axis. But for each data point the tooltip should show the correct and full label and value.

jrutz commented 5 years ago

I also ran into this issue. It doesn't seem to be supported in this particular version of chartJs. The workaround I found for displaying a minimal number of ticks was to do a mod on the label array (not sure what the resolution would be for the tooltips)

for(var i = 0; i < labels.length; i ++ ) {
    if(i % 5 === 0) {
        labels.push(dateString);
    } else {
         labels.push('');
    }
}

Would still love to see support of the autoSkip option in the future