c# - 使用 Json 数组填充图表

Question

我正在使用HighCharts来绘制 Json 数据。

我正在使用折线图选项，我正在填充这样的点 -

C＃

protected string intsAsJSArray
    {
        get
        {
            return string.Format("[{0}]", string.Join(",", listOfInts));
        }
    }
protected string datesAsJSArray
    {
        get
        {
            return string.Format("[{0}]", string.Join(",", listOfDates));
        }
    }

象素

series: [{
            type: 'area',
            name: 'Count:',
            pointInterval: 24 * 3600 * 1000,
            pointStart: Date.UTC(2013, 10, 31),
            data: <%= intsAsJSArray %>               
        }]

目前pointStart是硬编码的，但是我想要实现的是为每个日期在listOfDates图表上为相应的 int in 设置一个点listOfInts。我认为返回一个列表可能是一个更好的主意，其中每一行是一个 int 和 date 的连接，即listOfRecords.Add(1,2013-10-31)然后在 Javascript 中拆分它。我怎么能做到这一点？

Answer 1

只需将 x 轴变量设置为等于您的列表。

        var mydata = @Json.Encode(Model.intsAsJSArray);
        var myHeaders = @Html.Raw(@Json.Encode(Model.datesAsJSArray));

        $(function () {
            $('#chart').highcharts({
                xAxis: {
                    categories: myHeaders,
                },
                series: [{
                    name: 'Some data I have',
                    data: mydata
                }]
            });
        });

不过，您必须确保两个数组的大小相同。您可以在视图模型中用日期填充数组。

Answer 2

其他方法是为每个点使用 x/y 参数，使用 highstock 并将序数参数设置为 false。

http://api.highcharts.com/highstock#xAxis.ordinal