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));
        }
    }

.aspx的

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

目前pointStart是硬编码的，但我想要实现的是listOfDates中的每个日期在图listOfInts中为相应的int设置一个点。我想也许回到一个列表是个好主意，其中每一行都是int和日期的连接，即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和set ordinal参数为false。

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

使用Json数组填充图表

2 个答案: