Highcharts（时间序列可缩放）不适用于我的数据

Question

我刚开始玩高图表（Time-Series Zoomable）并且我有一个JSON数据像这样：

[
    {"StartTime":"2018-06-11T00:00:00","TotalReq":10},
    {"StartTime":"2018-06-12T00:00:00","TotalReq":34},
    {"StartTime":"2018-06-15T00:00:00","TotalReq":31},
    {"StartTime":"2018-06-16T00:00:00","TotalReq":2},
    {"StartTime":"2018-06-18T00:00:00","TotalReq":38},
    {"StartTime":"2018-06-19T00:00:00","TotalReq":69},
    {"StartTime":"2018-06-20T00:00:00","TotalReq":39},
    {"StartTime":"2018-06-21T00:00:00","TotalReq":100},
    {"StartTime":"2018-06-22T00:00:00","TotalReq":180},
    {"StartTime":"2018-06-25T00:00:00","TotalReq":104},
    {"StartTime":"2018-06-26T00:00:00","TotalReq":101},
    {"StartTime":"2018-06-27T00:00:00","TotalReq":123}
]

我正在尝试将 StartTime（日期）作为我的 x 轴参数，并将 TotalReq（计数）作为我的 y 轴参数-轴参数。

但出于某种原因，当我将此数据传递给图形时，它不会将数据加载到图形（空白屏幕）。我在某处出错了吗？如果是这样，请纠正我。非常感谢。

这是我目前正在处理的来自 highcharts 的工作示例。 Jsfiddle.

Answer 1

Highcharts 需要毫秒的时间。

因此您的选择是将字符串转换为 javascript，如下所示：

new Date("2018-06-27T00:00:00").getTime()

这意味着对于整个 table 你会这样做：

var arr = [
  {"StartTime":"2018-06-11T00:00:00","TotalReq":10},
  {"StartTime":"2018-06-12T00:00:00","TotalReq":34},
  {"StartTime":"2018-06-15T00:00:00","TotalReq":31},
  {"StartTime":"2018-06-16T00:00:00","TotalReq":2},
  {"StartTime":"2018-06-18T00:00:00","TotalReq":38},
  {"StartTime":"2018-06-19T00:00:00","TotalReq":69},
  {"StartTime":"2018-06-20T00:00:00","TotalReq":39},
  {"StartTime":"2018-06-21T00:00:00","TotalReq":100},
  {"StartTime":"2018-06-22T00:00:00","TotalReq":180},
  {"StartTime":"2018-06-25T00:00:00","TotalReq":104},
  {"StartTime":"2018-06-26T00:00:00","TotalReq":101},
  {"StartTime":"2018-06-27T00:00:00","TotalReq":123}]

arr.map(function(data) { return {x: new Date(data.StartTime).getTime(), y: data.TotalReq }})

哪个 returns 该日期的毫秒值。或者用 c# 来做。

工作 JSFiddle 示例： https://jsfiddle.net/ewolden/rxLkn2u5/

Highcharts（时间序列可缩放）不适用于我的数据

High charts (Time Series Zoomable) not working with my data

c#

asp.net-mvc

json

highcharts

timeserieschart