Chartjs-ChartJS stacked bar chart not displaying as stacked

by

1👍

The reason for this is because you only have one dataset, and so chart.js displays everything along the x-axis. To create a stacked bar chart, you’ll need to use multiple datasets. For this you’ll have to store the data separately:

// Set chart labels
chartLabels = ['Red', 'Blue']
// Store data in separate array
DaysOut_A.push(data[i].A);
DaysOut_B.push(data[i].B);

And then create separate datasets for each:

var chartdata = {
  labels: chartLabels,         // Label for entire chart
  datasets : [
    {
      label:'Total Jobs A' ,   // Label for 1st Dataset
      backgroundColor: "#22aa99",
      borderColor: "#22aa99",
      hoverBackgroundColor: "#22aa99",
      hoverBorderColor: "#22aa99",
      data: DaysOut_A            // Data for 1st Dataset
    },{
      label:'Total Jobs B',      // Label for 2nd Dataset
      backgroundColor: "#aa2222",
      borderColor: "#aa2222",
      hoverBackgroundColor: "#aa2222",
      hoverBorderColor: "#aa2222",
      data: DaysOut_B           // Data for 2nd Dataset
    }
  ]
};

Leave a comment