Question

我是JSON和mvc的新手，所以这是我的问题。我目前正在使用highcharts处理图形。我有一个控制器，它返回一个JSON对象。

 public JsonResult _GetChart_TrendPublicationTypeDetailed_Data(int 
 yearToDisplay)
    {
        //Types of publications to be considered
        string[] publication_types = new string[] { "article", "book", "book_section", "conference_proceedings" };

        //Get the list of outputs with usp authors
        var uspPubs = _uspAuthoredPublications();

        //List of years for which to display the data
        List<int> yearRange = _getListOfYears(yearToDisplay, yearRangeFactor_10);

        //Get the data
        var data = from eprint_summary in localDB.Summary
                   where
                   eprint_summary.Year > (yearToDisplay - yearRangeFactor_10)
                   && eprint_summary.Year <= yearToDisplay
                   && publication_types.Contains(eprint_summary.TypeCode)
                   && uspPubs.Contains(eprint_summary.EprintId)
                   //&& eprint_summary.refereed == "TRUE" //TODO: Confirm whether we need this filter in our counts
                   group eprint_summary by new { eprint_summary.Year, eprint_summary.TypeDesc } into typeTrend
                   orderby typeTrend.Key.Year, typeTrend.Key.TypeDesc
                   select new
                   {
                       Year = typeTrend.Key.Year,
                       Type = typeTrend.Key.TypeDesc,
                       Count = typeTrend.Count()
                   };

        //Extract the series data
        List<object> countData = new List<object>();
        foreach (var item in data.ToList().Select(y => y.Type).Distinct().OrderBy(y => y))
        {
            List<int> yearlyData = new List<int>();
            foreach (var year in yearRange)
            {
                var rec = data
                            .Where(y => y.Type == item)
                            .Where(y => y.Year == year)
                            .Select(y => y.Count).ToArray();
                yearlyData.Add(
                                rec == null || rec.Length == 0 ? 0 : rec[0]
                            );
            }

            countData.Add(
                            new
                            {
                                name = item, //Name of the series
                                data = yearlyData.ToArray() //Array of data
                            }
                        );
        }

        //Form the json object using the series data and labels
        return Json(
                new
                {
                    labels = yearRange.ToArray(),
                    series = countData
                },
                JsonRequestBehavior.AllowGet
            );
    }

以上是我在控制器中的JSON。

我的视图如下所示，我获取JSON对象，但我不知道如何将其作为系列附加到我的图形中。如何将JSON对象转换为系列接受的内容。

var seriesData = ' ';
var test = ' ';

function ajaxCall() {
    $.ajax({
        type: "post",
        datatype: "Json",
        async: true,
        url: '@Url.Action("_GetChart_TrendPublicationTypeDetailed_Data", "ResearchCharts")',
        data: { yearToDisplay: '@(DateTime.Now.AddYears(-1).Year.ToString())' },
        success: function (data) {
            seriesData = data;
            test = seriesData.series;
            //bindChart(test);
            //alert(JSON.stringify(seriesData));
            alert(JSON.stringify(test));

        },
        error: function () {
            alert("An error occurred.");
        }
    });
}
//functions call
ajaxCall();
bindChart(test);

function bindChart(test) {

    var test2 = [{ "name": "Book", "data": [14, 17, 9, 10, 6, 19, 6, 8, 0, 4] }, { "name": "Book Chapter", "data": [65, 74, 44, 66, 9, 23, 36, 51, 53, 36] }, { "name": "Conference Proceedings", "data": [15, 17, 27, 30, 28, 54, 35, 43, 50, 35] }, { "name": "Journal Article", "data": [178, 162, 133, 139, 133, 191, 160, 194, 149, 169] }];
    $('#chartTrendsPublicationTypeDetailed').highcharts({
        chart: {
            type: 'line'
        },
        title: {
            text: 'My data'
        },
        xAxis: {
            categories: ['2007', '2008', '2009', '2010', '2011', '2012', '2013', '2014', '2015', '2016']
        },
        series: test2//[{ "name": "Book", "data": [14, 17, 9, 10, 6, 19, 6, 8, 0, 4] }, { "name": "Book Chapter", "data": [65, 74, 44, 66, 9, 23, 36, 51, 53, 36] }, { "name": "Conference Proceedings", "data": [15, 17, 27, 30, 28, 54, 35, 43, 50, 35] }, { "name": "Journal Article", "data": [178, 162, 133, 139, 133, 191, 160, 194, 149, 169] }]


    });

请帮助，只需要以某种方式将数据传递给highcharts。在图片中，我手动添加了该系列并且它可以工作，但我需要传入一个系列属性接受的变量。

Answer 1

Old Highcharts渲染代码：

$('#chartTrendsPublicationRankDetailed').highcharts({
       chart: {
           type: 'line'
       },
       title: {
           text: 'My data'
       },
       xAxis: {
           categories: labels
       },
       series: seriesData

   });

New Highcharts rendering code. This accepts my JSON objects successfully and renders the graphs.

function bindChartItemType(seriesData, labels) {
var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'chartTrendsPublicationTypeDetailed',
        type: 'line',
        height: 500,
        width: 500
    },
    credits: {
        enabled: false
    },
    title: {
        text: 'Trend of Publications by Item Type'
    },
    xAxis: {
        categories: labels,
        title: {
            text: '<b>Year</b>'
        }
    },
    yAxis: {
        min:0,
        title: {
            text: '<b># of publications</b>'
        }
    },
    series: seriesData
});

}

随意在评论中添加您喜欢的任何内容。

此致 Shafraz Buksh

来自JSON对象的Highcharts系列数据

1 个答案: