如何在vue-chartkick中传递堆积图的数据

Question

我尝试了很多选择，但无法创建具有堆积表示的柱形图或条形图。我想我不知道该如何呈现数据。我尝试了以下方法：

[
        [
            "Monday",
            2,
            10
        ],
]

[
        [
            "Monday",
            [2],
            [10]
        ],
]

[
        [
            "Monday",
            [
              2,
             10
            ]
        ],
]

Answer 1

首先，您可以阅读文章Stacked Bar Chart with Chart.js，它逐步说明了如何创建堆积的条形图。

我还制作了一个代码示例，希望可以产生您想要的东西。

new Chart(document.getElementById("myChart"), {
  type: "bar",
  data: {
    labels: ['Monday'],
    datasets: [{
      label: "X",
      data: [2],
      backgroundColor: "red"
    },
    {
      label: "Y",
      data: [10],
      backgroundColor: "blue"
    }]
  },
  options: {
    scales: {
      xAxes: [{
         stacked: true
      }],
      yAxes: [{
        stacked: true
      }]      
    }
  }
});

canvas {
  max-width: 200px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>
<canvas id="myChart" width="20" height="20"></canvas>