Dynamic labels using chartjs

We have a huge mass of json data with over 1000 records and we are trying to plot a line / bar chart for the same. However, as expected, these huge recordings overlap and we see almost nothing.

Is it possible to adjust the value of the step of labels on the chart?

The graph will actually be sorted by date and will show the month of the data and we just want to show for example 6 dates (every 5th day). I know this can be done programmatically, grouping the json data as needed, however we're just wondering if there is a standard solution for the same.

My code:

var line_chart = {
    labels : labelsX, // contains all the labels
    datasets : [

      {
        fillColor : "rgba(151,187,205,0.5)",
        strokeColor : "rgba(151,187,205,0.8)",
        highlightFill : "rgba(151,187,205,0.75)",
        highlightStroke : "rgba(151,187,205,1)",
        data : chartjsData // contains the value
      }
    ]
  }
 window.onload = function(){
    var ctx = document.getElementById("canvas").getContext("2d");
    window.myLine = new Chart(ctx).Line(line_chart, {
      responsive: true
     });
  }

      

+3


source to share


1 answer


I'm not sure how your labels and values ​​stand right now, but they should be arrays this way:

labelsX = ["January", "February", "March"];
chartjsData  = [40, 10, 20];

      



Arrays should work this way. hope this helps.

0


source







All Articles