ASP.NET MVC JsonResult和JQuery flot

dp.*_*dp. 5 asp.net-mvc json jquery-plugins

我正在尝试使用带有asp.net mvc 的jquery flot graphing插件.我正在尝试从JsonResult动态提取数据以填充图形.

我的问题是我似乎无法以正确的格式从JsonResult返回数据.

这是我的服务器端代码:

    public ActionResult JsonValues()
    {
        IList<IDictionary<string, int>> listofvalues = new List<IDictionary<string, int>>();
        IDictionary<string, int> values1 = new Dictionary<string, int>();
        values1.Add("2003", 10882);
        values1.Add("2002", 10383);
        values1.Add("2001", 10020);
        values1.Add("2000", 9762);
        values1.Add("1999", 9213);
        values1.Add("1998", 8720);

        IDictionary<string, int> values3 = new Dictionary<string, int>();
        values3.Add("2003", 599);
        values3.Add("2002", 510);
        values3.Add("2001", 479);
        values3.Add("2000", 457);
        values3.Add("1999", 447);
        values3.Add("1998", 414);

        listofvalues.Add(values1);
        listofvalues.Add(values3);

        JsonResult result = new JsonResult { Data = listofvalues };
        return result;
    }
Run Code Online (Sandbox Code Playgroud)

这是我的客户端代码:

    $(function() {
        $.getJSON("/path/to/JsonValues", function(data) {
            var plotarea = $("#plot_area");
            $.plot(plotarea, data);
        });
    });
Run Code Online (Sandbox Code Playgroud)

注意,以下客户端代码工作正常:

    $(function() {
        var points = [
            [[2003, 10882],
            [2002, 10383],
            [2001, 10020],
            [2000, 9762],
            [1999, 9213],
            [1998, 8720]],

            [[2003, 599],
            [2002, 510],
            [2001, 479],
            [2000, 457],
            [1999, 447],
            [1998, 414]]
        ];

        var plotarea = $("#plot_area");
        $.plot(plotarea, points);
    });
Run Code Online (Sandbox Code Playgroud)

鉴于以上工作正常,似乎只是正确格式化返回的JsonResult.我怎样才能做到这一点?字典列表是最好的返回类型,还是我应该使用其他东西?或者我是否应该使用javascript中的函数来正确格式化数据?

看起来真的很简单,但我无法让它发挥作用.

Dav*_*enn 5

检查返回给客户端的 Json,它将是带有键值对的 Json 对象,例如:

{{'2003':10882,'2002':10383},....}
Run Code Online (Sandbox Code Playgroud)

哪里需要一个数组数组。

[[[2003, 10882],[2002, 10383]],...]
Run Code Online (Sandbox Code Playgroud)

你总是可以自己生成 Json 字符串并返回结果

StringBuilder sb = new StringBuilder();
sb.append("[2003,10882],")
return Json("[" + sb.ToString() + "]");
Run Code Online (Sandbox Code Playgroud)

或者您可以尝试将您的值存储在可能生成所需 Json 的数组中,但我还没有尝试过。


bou*_*nav 5

如果你想用 C# 数组来做,你可以执行以下操作:

var values = new object[] {
    new object[] /* First series of value */
    {
        new int[,] { {2003,10882} },
        new int[,] { {2002,10383} }
    }
};
Run Code Online (Sandbox Code Playgroud)

进而

return Json(values);
Run Code Online (Sandbox Code Playgroud)


Tho*_*mas 5

您需要以下形式的 JSON 数组:

[[1, 1], [2, 3], [5, 5]]
Run Code Online (Sandbox Code Playgroud)

浮点类别插件需要以下形式的数据:

[["category1", 12], ["category2", 3]]
Run Code Online (Sandbox Code Playgroud)

这在 C# 中创建并不简单(不得不搜索很长时间:-))

关键是创建对象数组( object [])

未经测试的代码如下:

IEnumerable<object[]> values1_array = from x in values1 
select new object [] {x.Key, x.Value};

IEnumerable<object[]> values3_array = from x in values3 
select new object [] {x.Key, x.Value};

//create one big object
var dataArray = new object[] {
    new {data = values1_array, label="Values1"},
    new {data = values3_array, label="Values3"},
};

//return Json data
return Json(dataArray) /* JsonRequestBehavior.AllowGet ?*/
Run Code Online (Sandbox Code Playgroud)

你的 JavaScript 代码应该可以工作:

$(function() {
    $.getJSON("/path/to/JsonValues", function(data) {
        var plotarea = $("#plot_area");
        $.plot(plotarea, data);
    });
});
Run Code Online (Sandbox Code Playgroud)