ChartJs 如何将条形图移动到新组中？

Question

这个问题困扰我太久了哈

所以我只想手动控制组栏，下面蓝色的应该在Checkout 2下。

非常感谢任何帮助。

var data = [
        {
            label: "Android",
            type: "bar",
            stack: "One",
            backgroundColor: "#F6AC74",
            data: [4]
        },
        {
            label: "iOS",
            type: "bar",
            stack: "One",
            backgroundColor: "#9FA0EF",
            data: [6]
        },
        {
            label: "Web",
            type: "bar",
            stack: "One",
            backgroundColor: "#F495C6",
            data: [14]
        },
        {
            label: "Apple Pay",
            type: "bar",
            stack: "Two",
            backgroundColor: "#AEE9DD",
            data: [6]
        },
        {
            label: "Google Pay",
            type: "bar",
            stack: "Two",
            backgroundColor: "#D3F284",
            data: [14]
        }
        ,
        {
            label: "Cash",
            type: "bar",
            stack: "Three",
            backgroundColor: "#65C2F8",
            data: [4]
        }
    ];

    $scope.AdvancedMethodStackedBarChart = new Chart(document.getElementById("advPaymentMethodChart"), {
        type: 'bar',
        data: {
            labels: ["Checkout 1", "Checkout 2"],
            datasets: data
        },
        options: {
            legend: { display: false },
            scales: {
                xAxes: [{
                  stacked: true,
                  ticks: {
                    beginAtZero: true,
                    maxRotation: 0,
                    minRotation: 0
                  }
                }],
                yAxes: [{
                  stacked: true,
                }]
              },
            title: {
                display: false,
            }
        }
    });

据说我的评论主要是代码，但我不需要说更多，我的意思是我画了一张图，这东西还需要多少细节？

Answer 1

要移动它，你需要告诉 chart.js 该值应该映射到第二个标签，方法是将它放在数据数组的第二个位置，这可以通过添加 null 前面的值。所以您的现金数据集将如下所示：

{
  label: "Cash",
  type: "bar",
  stack: "Three",
  backgroundColor: "#65C2F8",
  data: [null, 4]
}

ChartJs 如何将条形图移动到新组中？

ChartJs how can I move bar into new group?

chart.js

chartjs-2.6.0