highchartが使用するためのJavaScriptで正しい形式ではない配列

Question

こんにちは私は私のコントローラーからJavaScriptにリストオブジェクトを渡し、そこでそれが配列に戻され、HighChart棒グラフのデータソースとして使用されます。

以下の私のコードでは、生データに戻ってコメントした場合、機能します。 「結果」と呼ばれる配列変数を使用すると、何も得られません

デバッガーと出力を使用してJavaScriptに足を踏み入れた場合、すぐにウィンドウになります。

？result [0] {...} [0]： "2" [1]：{...}

？result [0] [1] {...} [0]：0 [1]：0 [2]：0 [3]：0 [4]：0 [5]：0 [6]：1 [7 ]：0 [8]：0 [9]：0 [10]：0 [11]：0

これがコードです：

function CreateChart3(surl) {

    // Code block for fetching Array as jsonResult (js)
    var url = $("#AbsolutePath").val() + "Complaint.mvc/GetChartData_MonthlyByType/" + surl;

    var chart;

    $.getJSON(url, null, function(data) {

        var result = [];
        jQuery.each(data, function(i, val) {
            result[i] = [val.Type, val.Count];
        });

        //            var seriesData = [];
        //            for (var i = 0; i < result.length; i++) {
        //                seriesData.push({ data: result[i][1] ,name: result[i][0]});
        //            }

        debugger;
        chart = new Highcharts.Chart({
            chart: {
                renderTo: 'chart3',
                defaultSeriesType: 'column',
                plotBackgroundColor: null,
                plotBorderWidth: null,
                plotShadow: false
            },
            title: {
                text: 'Stacked Bar Monthly By Type'
            },
            yAxis: {
                min: 0,
                title: {
                    text: 'Total No Of Complaints'
                },
                xAxis: {
                    categories: ['JAN', 'FEB', 'MAR', 'APR', 'MAY', 'JUN', 'JUL', 'AUG', 'SEP', 'OCT', 'NOV', 'DEC'],
                    title: 'Month'
                },
                stackLabels: {
                    enabled: true,
                    style: {
                        fontWeight: 'bold',
                        color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
                    }
                }
            },
            legend: {
                backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColorSolid) || 'white',
                borderColor: '#CCC',
                borderWidth: 1,
                shadow: false
            },
            tooltip: {
                formatter: function() {
                    return '<b>' + this.x + '</b><br/>' +
            this.series.name + ': ' + this.y + '<br/>' +
            'Total: ' + this.point.stackTotal;
                }
            },
            plotOptions: {
                column: {
                    stacking: 'normal',
                    dataLabels: {
                        enabled: true,
                        color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white'
                    }
                }
            },
            //                            series:
            //                                 [{
            //                                    name: "2",
            //                                    data: [0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0]
            //                                        }, {
            //                                    name: "3",
            //                                    data: [1, 0, 0, 0, 0, 0, 0, 1, 0, 0, 3, 0]

            //                                    }]
            series: [{
                data: result
                }]
            });
        });
    };

それが役立つ場合、コントローラーコードから抽出......

         var qry = from i in _db.Complaints
                  where i.Site.SiteDescription.Contains(searchTextSite)
                       && (i.Raised >= startDate && i.Raised <= endDate)
                  group i by i.ComplaintNatureTypeId.ToString()
                      into grp
                      select new
                          {
                              Type = grp.Key,
                              Count = new int[] { 
                                  grp.Where(c => c.Raised.Month == 1).Count(),
                                      grp.Where(c => c.Raised.Month == 2).Count(),
                                      grp.Where(c => c.Raised.Month == 3).Count(),
                                      grp.Where(c => c.Raised.Month == 4).Count(),
                                      grp.Where(c => c.Raised.Month == 5).Count(),
                                      grp.Where(c => c.Raised.Month == 6).Count(),
                                      grp.Where(c => c.Raised.Month == 7).Count(),
                                      grp.Where(c => c.Raised.Month == 8).Count(),
                                      grp.Where(c => c.Raised.Month == 9).Count() ,
                                      grp.Where(c => c.Raised.Month == 10).Count() ,
                                      grp.Where(c => c.Raised.Month == 11).Count(),
                                      grp.Where(c => c.Raised.Month == 12).Count() }

                          };


        return Json(qry.ToArray(), JsonRequestBehavior.AllowGet);

Answer 1

覚えている限り data の財産 series の配列です

1. Y値
2. XY値のペア
3. ポイントオブジェクト

私が理解しているように、あなたの配列のすべての要素は、要素[0]がある配列であることを理解しています name 要素[1]はy値の配列です。したがって、いくつかのシリーズがあります。手動で変換する必要があります { name: ..., data: ...} オブジェクトとそれをHighChartsコンストラクターに渡します。使用する for ループ：

var seriesData = [];
for (var i = 0; i < result.length; i++){
    seriesData.push({ name: result[i][0], data: result[i][1] });
}

次のようなシリーズデータを使用します。

series: seriesData

Answer 2

デバッガー出力を見ると、JSONはあなたが期待しているものではありません。

明確に言うのは難しいですが、コントローラーから正しいオブジェクトを返していますか？戻ってきているようです qry 使用する必要がある場合 grp.