1

私は現在、初めて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 = "tara";
        test.Value = 3;
        sampleData.Add(test);

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

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

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

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

        return Json(sampleData, JsonRequestBehavior.AllowGet);
    }

これは私が作成した円グラフの例です。可能であれば、棒グラフのJSONデータをフォーマットする方法の例を教えてもらえますか？

これは、JSONデータが入力されているビューです。

    jQuery(document).ready(function () {
    urlDataJSON = '/Home/PieChartJSON';

    $.getJSON(urlDataJSON, "", function (data) {
        var dataSlices = [];
        var dataLabels = "";

        $.each(data, function (entryindex, entry) {
            dataSlices.push(entry['Value']);
            dataLabels = dataLabels + entry['Label'];
        });
        options = {
            legend: { show: true },
            title: 'Poll Results',
            seriesDefaults: {
                // Make this a pie chart.
                renderer: jQuery.jqplot.PieRenderer,
                rendererOptions: {
                    // Put data labels on the pie slices.
                    // By default, labels show the percentage of the slice.
                    showDataLabels: true
                }
            }
        }
        var plot = $.jqplot('pieChart', [dataSlices], options);
    });
});

そしてこれは私がウェブページで得るチャートです：

編集：スクリーンキャプチャの埋め込みが機能していません。だから私はそれへのリンクを含めます。 http://imgur.com/xwo3E

4

1 に答える 1

2

ここでは、あなたが何をしているのかわかりませんdataLabels。また、円グラフで気に入らないのは、凡例にラベルが表示されていないことだけだと思いますよね？

別の方法でデータを設定する必要があると思います。円グラフの使用に関連する他の例の1つを見てください。ここで入手できます。事実上、問題は、リンクされたコードのように、データの各行にペアを設定し、最初にラベルを設定し、次に値を設定することにあります。

var row = [percentage, count];
data.push(row);

したがって、あなたの場合は次のようになります。

var dataSlices = [];
$.each(data, function (entryindex, entry) {
    var row = [entry['Label'], entry['Value']];
    dataSlices.push(row);
});
于 2012-05-08T11:14:44.493 に答える