javascript - Chart JS - 如何将 JSON 对象输出到 PIE 变体中

Question

我正在将 JSON 响应拉入 ChartJS 饼图。阅读它说它需要使用数据集的文档:

datasets: [{
    data: [10, 20, 30]
}],

对于我的用例，JSON 的引入方式为:

{
    "action": "data_link_referer",
    "result": {
        "url_ending": "0",
        "data": [{
            "label": "Link1",
            "clicks": 3
        }, {
            "label": "Link2",
            "clicks": 3
        }, {
            "label": "Link3",
            "clicks": 2
        }]
    }
}

在图表函数中，我正在提取 [数据]。我想将 clicks 设置为值。

function drawChartPie(jsonObj) {
    var ctx = document.getElementById("myChartPie");
    var data = jsonObj["result"]["data"];

    var myPieChart = new Chart(ctx,{
        type: 'pie',
        data: {
            labels: data,

            datasets: [{
                label: 'Referers',
                data: data,
            }]
        },
    });
}

Answer 1

这会将您的数据转换为适合 ChartJS 的格式

function formatData(response) {
    let newFormat = {
        datasets: [{
            data: []
        }],
        labels: []
    };
    response.result.data.forEach(item => {
        newFormat.datasets[0].data.push(item.clicks);
        newFormat.labels.push(item.label);
    });
    return newFormat;
}