Jquery 为JqPlot条形图构建JSON

我已经设法创建了一些东西来填充JqPlot饼图（非常硬编码——它将是自动化的）。我是这样做的：

public ActionResult PieChart()
    {
        return View();
    }

    public ActionResult PieChartJSON()
    {
        List<PieChartData> sampleData = new List<PieChartData>();
        PieChartData test = new PieChartData();
        PieChartData test2 = new PieChartData();
        PieChartData test3 = new PieChartData();
        PieChartData test4 = new PieChartData();
        PieChartData test5 = new PieChartData();
        
        test.Label = "ta";
        test.Value = 3;
        sampleData.Add(test);

        test2.Label = "be";
        test2.Value = 5;
        sampleData.Add(test2);

        test3.Label = "ga";
        test3.Value = 3;
        sampleData.Add(test3);

        test4.Label = "ma";
        test4.Value = 8;
        sampleData.Add(test4);

        test5.Label = "ja";
        test5.Value = 8;
        sampleData.Add(test5);

        return Json(sampleData, JsonRequestBehavior.AllowGet);
    }

*生成的图形

我希望能够创建类似于下一页上的条形图的东西：（第二个图表向下）。此条形图是使用以下jQuery创建的：

我对C#和Json非常陌生，我有点不确定应该如何构造Json数据来创建这个条形图。 有人能帮我吗

  $(document).ready(function(){
    // For horizontal bar charts, x an y values must will be "flipped"
    // from their vertical bar counterpart.
    var plot2 = $.jqplot('chart2', [
        [[2,1], [4,2], [6,3], [3,4]], 
        [[5,1], [1,2], [3,3], [4,4]], 
        [[4,1], [7,2], [1,3], [2,4]]], {
        seriesDefaults: {
            renderer:$.jqplot.BarRenderer,
            // Show point labels to the right ('e'ast) of each bar.
            // edgeTolerance of -15 allows labels flow outside the grid
            // up to 15 pixels.  If they flow out more than that, they 
            // will be hidden.
            pointLabels: { show: true, location: 'e', edgeTolerance: -15 },
            // Rotate the bar shadow as if bar is lit from top right.
            shadowAngle: 135,
            // Here's where we tell the chart it is oriented horizontally.
            rendererOptions: {
                barDirection: 'horizontal'
            }
        },
        axes: {
            yaxis: {
                renderer: $.jqplot.CategoryAxisRenderer
            }
        }
    });
});

---

了解到您想要为给定数据构建条形图，您可以通过以下方式构建数据许可证，假设您的

JSON

数据是一个数组：

var json = [
    {"Label": "be", "Value": 5}
    ,{"Label": "ga", "Value": 3}
    ,{"Label": "ma", "Value": 8}
    ,{"Label": "ja", "Value": 8}];
var dataSlices = [];
var ticks = [];
$.each(json, function (entryindex, entry) {
    dataSlices.push(entry['Value']);
    ticks.push(entry['Label']);
});

---

这是一种重用。

的方法，了解到您想要为给定数据构建条形图，您可以通过以下方式构建数据许可证，假设您的

JSON

数据是一个数组：

var json = [
    {"Label": "be", "Value": 5}
    ,{"Label": "ga", "Value": 3}
    ,{"Label": "ma", "Value": 8}
    ,{"Label": "ja", "Value": 8}];
var dataSlices = [];
var ticks = [];
$.each(json, function (entryindex, entry) {
    dataSlices.push(entry['Value']);
    ticks.push(entry['Label']);
});

---

这是一种重复使用a的方法。

试试这个，效果很好

 $.getJSON('/mservice/getvalues', function(data) {
        var items1 = new Array();
        var j=0;
        for ( var i in data ) {
            var items = new Array();
            items.push(i,Number(data[i]));
            items1[j++] = items;
        }

        var plot1 = jQuery.jqplot('chart1', eval([items1]), {

                    seriesDefaults:{
                        renderer:jQuery.jqplot.PieRenderer,
                        rendererOptions:{
                            dataLabels:'value',
                            showDataLabels:true
                        }
                    },
                    legend:{ show:true, location:'e' }
                }
        );

    });

---

试试这个，工作很好

 $.getJSON('/mservice/getvalues', function(data) {
        var items1 = new Array();
        var j=0;
        for ( var i in data ) {
            var items = new Array();
            items.push(i,Number(data[i]));
            items1[j++] = items;
        }

        var plot1 = jQuery.jqplot('chart1', eval([items1]), {

                    seriesDefaults:{
                        renderer:jQuery.jqplot.PieRenderer,
                        rendererOptions:{
                            dataLabels:'value',
                            showDataLabels:true
                        }
                    },
                    legend:{ show:true, location:'e' }
                }
        );

    });

---

两件事。。要创建饼图还是条形图？你能用c#创建json吗？我想创建一个条形图。正如您在第一个代码片段中看到的，我可以为饼图创建json，但我不知道条形图数据应该如何构造。检查我在答案中发布的链接。两件事。。要创建饼图还是条形图？你能用c#创建json吗？我想创建一个条形图。正如您在第一段代码中看到的，我可以为饼图创建json，但我不知道条形图数据应该如何构造。请查看我在答案中发布的链接。