score:6

Accepted answer

this plot type is called "stacked bar" and is included in the chart.js samples. the documentation is quite clear.

here's a working example:

new chart(document.getelementbyid("chart"), {
  type: "horizontalbar",
  data: {
    labels: ["a", "b"],
    datasets: [{
        data: [1, 4],
        backgroundcolor: "#0033a0"
      },
      {
        data: [3, 1],
        backgroundcolor: "#1a79bf"
      },
      {
        data: [2, 2],
        backgroundcolor: "#b2b2b2"
      }
    ]
  },
  options: {
    scales: {
      xaxes: [{
        stacked: true
      }],
      yaxes: [{
        stacked: true
      }]
    }
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/chart.js/2.9.3/chart.min.js"></script>
<canvas id="chart"></canvas>


Related Query

More Query from same tag