json - ASP.Net MVC - Google Charts 的 Json 数据

Question

Google Charts 新手，我正在尝试创建 Google Chart， Controller 返回 JSON 数据，例如

{"data":[["In Progress","10"],["Completed","20"],["Deleted","5"],["Overdue","8"]]}

但是Google图表所需的数据应该是这样的

[["In Progress",10],["Completed",20],["Deleted","5"],["Overdue",8]]

我有以下 JS 函数:

$(document).ready(function () {
        $.ajax({
            url: '@Url.Action("TaskStatus", "Graph")',
            data: "",
            dataType: "json",
            type: "POST",
            contentType: "application/json; chartset=utf-8",
            success: function (data) {                   
                var jsonData = JSON.stringify(data);

                var dt = new google.visualization.DataTable();
                dt.addColumn('string', 'Tasks');
                dt.addColumn('number', 'Count');

                $.each(arrJson, function (i, obj) {
                    $.each(obj, function (i, o) {
                        console.log(o[1]);                            
                        dt.addRow(o[0],parseInt(o[1])); // here I get error of datatype for "Count" column
                    })                                              
                })
                chartData = dt;
            },
            error: function (err) {
                alert(err);
                console.log(err);
            }
        }).done(function () {
            drawChart();
        })
    })

function drawChart()
{           
var options = {
                width: '500px',
                title: "Task Status",
                pointSize: 20,
                chartArea:{width:"100%",height:"100px"}
            };
        var pieChart = new google.visualization.PieChart(document.getElementById('chart_div'));
        pieChart.draw(chartData, options);
}

Controller 返回

List<object> temp = new List<object>();
            temp.Add(new[] { "In Progress", "10" });
            temp.Add(new[] { "Completed", "20" });
            temp.Add(new[] { "Deleted", "5" });
            temp.Add(new[] { "Overdue", "8" });

            return Json(new { data = temp });

请问如何解决这个问题？预先非常感谢!

Answer 1

您不应在 AJAX 成功回调中使用 JSON.stringify 函数，因为这会将您从服务器获取的对象转换为字符串。你可以试试这个:

success: function (result) {
    var dt = new google.visualization.DataTable();
    dt.addColumn('string', 'Tasks');
    dt.addColumn('number', 'Count');

    // Taking the "data" property as your controller returns it that way
    var data = result.data;

    $.each(data, function (i, obj) {
        var label = obj[0];
        var value = parseInt(obj[1]);
        dt.addRow([label, value]);
    });

    chartData = dt;
},