Question

我有以下C＃代码：

public JsonResult Graph()
{
    var result = new Dictionary<DateTime, decimal> { { DateTime.Today.ToUniversalTime(), 1000 }, { DateTime.Today.AddDays(-1).ToUniversalTime(), 2000 }, { DateTime.Today.AddDays(-2).ToUniversalTime(), 5000 } };

    return Json(result.ToArray(), JsonRequestBehavior.AllowGet);
}

当我查看firebug时，JSON数据如下所示：

[{"Key":"\/Date(1319515200000)\/","Value":1000},{"Key":"\/Date(1319428800000)\/","Value":2000},{"Key":"\/Date(1319342400000)\/","Value":5000}]

我的Highcharts配置如下：

var options = {
    chart: {
        renderTo: 'chart',
    },
    xAxis: {
        type: 'datetime'
    },
    series: []
}

jQuery.getJSON("/graph", null, function (items) {
    var series = {
        type: 'column',
        data: []
    };

    jQuery.each(items, function (itemNo, item) {
        series.data.push({
            name: item.Key,
            y: item.Value
        })
    });

    options.series.push(series);

    chart = new Highcharts.Chart(options);
    chart.render();
});

x轴不会显示我的日期。非常感谢任何帮助。

Answer 1

我最终使用了：

Dictionary<string, decimal>()

我基本上将日期作为字符串传递给视图，最后使用

Date.parse(item.Key)

在客户端。它运作得很好。

Answer 2

假设item.Key包含类似“日期（1319342400000）”的内容，您可以尝试以下方法：

jQuery.each(items, function (itemNo, item) {
    var dateStr = item.Key;
    var dateVal = dateStr.substring(dateStr.indexOf('(')+1, dateStr.indexOf(')'));
    series.data.push([dateVal, item.Value]);
});

此外，您不需要以下行：

chart.render();

如果以上操作不起作用，您可以按如下方式检查item.Key的值：

jQuery.each(items, function (itemNo, item) {
    alert(item.Key);
    series.data.push(//...

<强>更新

然后您不需要使用substring和indexOf。只需按以下方式更改jQuery.each：

jQuery.each(items, function (itemNo, item) {        
    series.data.push([item.Key, item.Value]);
});

使用ASP.NET MVC使用Highcharts在x轴上显示日期

2 个答案: