使用json数据创建chartjs饼图

时间:2018-04-30 10:27:14

标签: javascript json chart.js

我试图使用chartjs显示多个图表。我有一个工作JSFIDDLE,带有硬编码的多个数据。如何使用来自控制器的检索到的json数据获得相同的结果?如何将检索到的json数据作为图表的数据集推送?

这是从我的控制器返回的json数据:

[{"countAgree":1,"countSomewhatAgree":0,"countDisagree":1},
{"countAgree":0,"countSomewhatAgree":1,"countDisagree":1},
{"countAgree":0,"countSomewhatAgree":1,"countDisagree":1}]

我尝试了以下操作,但未创建图表:

var charts = "myCharts";

var jsonData = [];

$.ajax({
    cache: false,
    async: false,
    type: "GET",
    url: '/Controller/GetData',
    dataType: 'json',
    success: function (response) {
        var obj = JSON.parse(response);
        $.each(obj, function (i, data) {
            jsonData.push({ data: [data[i].countAgree, data[i].countSomewhatAgree, data[i].countDisagree] });
        });
        //create chart
    }
});

我也试过

$.getJSON("/Controller/GetData", function (data) {
    for (var i = 0; i <= data.length - 1; i++) {
        jsonData.push({ data: [data[i].countAgree, data[i].countSomewhatAgree, data[i].countDisagree] });
    }

    //create charts
});

1 个答案:

答案 0 :(得分:0)

问题在于在循环中处理数据后的数据结构

将循环更改为以下内容:

>>> datasets
[{'gender': 'male', 'athlete': 'foo', 'finishTime': 15}, {'gender': 'female', 'athlete': 'bar', 'finishTime': 11}]
>>> sorted(dataset, key=lambda row: row["finishTime"])
[{'gender': 'female', 'athlete': 'bar', 'finishTime': 11}, {'gender': 'male', 'athlete': 'foo', 'finishTime': 15}]