ChartJs堆积条形图

桑敦·哈尔沙纳（Sandun Haarshana）

我有以下不同月份的数据

一月：[1,5,3]

2月：[10,5]

3月：[4,8]

4月：[7]

五月：[3,1,5,0,7]

我想生成条形图如下

现在，我有以下代码，我想知道如何生成如上图所示的条形图。

new Chart(document.getElementById("bar-chart"), {
type: 'bar',
data: {
  labels: ['Jan','Feb','Mar','Apr','May'],
  datasets: [{
      data: [1,5,3],
      label: 'Jan',
      backgroundColor: "#3e95cd",
    }
            , {
      data: [10,5],
      label: 'Feb',
      backgroundColor: "#8e5ea2",
    }, {
      data: [4,8],
      label: 'Mar',
      backgroundColor: "#4287f5",
    }
            , {
      data: [7],
      label: 'Apr',
      backgroundColor: "#23ebbc",
    }
            , {
      data: [3,1,5,0,7],
      label: 'May',
      backgroundColor: "#e63057",
    }
  ]
},
options: {
  title: {
    display: true,
    text: 'This is title'
  },
  backgroundColor:'#cfcfcf',
        scales: {
      xAxes: [{ stacked: true }],
      yAxes: [{ stacked: true }]
    }
}

}）;

谢谢

Thanh Trung

第一个数据集是[10,10,8,7,3]红色，第二个是[5,5,8,0,1]，第三个[3,0,0,0,5]，第四个[0,0,0,0,7]

当然，您必须使用自己的技能来转换Web服务发送的数据。但这是您要寻找的最终结果。

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。