如何使用列表数据创建 Javascript 饼图？

Question

所以我的数据目前的格式是

[
    {
        "B": 1
    },
    {
        "A": 1
    },
    {
        "A": 1
    }
]

我想用它来创建一个饼图。然而，我在网上使用的示例饼图需要这样的数据。

        [
            {y: 1, label: "User Group A"},
            {y: 1, label: "User Group B"},
        ]

这是我在网上找到的饼图代码

var chart = new CanvasJS.Chart("chartContainer", {
    animationEnabled: true,
    title: {
        text: "Did user group view page on ebay?"
    },
    data: [{
        type: "pie",
        startAngle: 240,
        yValueFormatString: "##0.00\"%\"",
        indexLabel: "{label} {y}",
        dataPoints: [
            {y: 1, label: "User Group A"},
            {y: 1, label: "User Group B"},
        ]
    }]
});
chart.render();

如何最好地将我的数据转换为 {y: data, label: "data"}？

或者我最好使用不同的 Javascript 饼图来更好地支持我的数据格式？

Answer 1

试试这个

[
    {
        "B": 1
    },
    {
        "A": 1
    },
    {
        "A": 1
    }
].map(data => {
    let key  = Object.keys(data)[0]
    return {y : data[key], label: key}
})