Highchart X 轴标签日期时间问题答案

【问题标题】：Highchart X-Axis Label DateTime IssueHighchart X 轴标签日期时间问题
【发布时间】：2018-06-11 09:22:43
【问题描述】：

我的要求

我需要绘制一个多系列图 - 值与日期时间（x 轴）。

我现在做了什么

我从后端获取数据，相应地操作系列并绘制 HighChart。

更新

我的代码如下：

for (i = 0; i < signals.DeviceSignalDataGroupList.length; i++) {
        ddd[i] = [];
        var DeviceSignalModel = signals.DeviceSignalDataGroupList[i];
        name.push(DeviceSignalModel[0].SignalName);
        $.each(DeviceSignalModel, function () {

            ddd[i].push([(new Date(parseInt((this.SignalData.TimeReceived).replace('/Date(', '')))).toLocaleString(), parseInt(this.SignalData.Value)]);  //<=======(LINE A)
            //ddd[i].push([(this.SignalData.TimeReceived).replace('/Date(', '').replace(')/', ''), parseInt(this.SignalData.Value)]); 
        });

        ddd[i] = ddd[i].reverse();
    }

我从后端得到的日期时间值（this.SignalData.TimeReceived）就像"/Date(1528387441000)/" 在上面的代码中（我标记为 LINE A），我替换它们并将新日期转换为 ToLocaleString()。

是这样吗？
如果没有这种转换，我也试过它不会给出预期的 x 轴日期标签
@ewolden 根据您的建议，我是否应该将.getTime() 包括在内？

变量ddd 中的这些数据的值如下：

来自后端的数据的屏幕截图

我的问题

X 轴标签未显示正确的日期格式。下面的屏幕截图显示了 X 轴值不正确的图表。我在这里做错了什么？我看到和我一样的问题 High-charts_x-axis datetime issue 但也无法从那里得到答案。

【问题讨论】：

正如您引用的另一个问题的答案所说，自 1970 年以来，时间需要以毫秒为单位。这是 highcharts 理解的时间格式。
但是随着这种变化，图表线变成垂直的，这就是更新后的答案所说的。 ___如果您仍然建议我，请让我如何更改我的数据值。
答案说，这是因为这个人对所有值都使用了相同的时间戳，但是一旦他们修复了它就修复了。你需要像这样转换：new Date(ddd[2][j).getTime() 其中 j 是一个新的 for 循环，遍历 ddd[2] 中的所有元素，即你的时间。
我刚刚看到你的带代码的图片，（请嵌入代码，不要使用图片，它让试图帮助的人更容易），你只需要使用@ Date 对象上的 987654334@。然后在 xAxis 上设置type: 'datetime'。
哦，好的，当然实际上嵌入了代码我无法 Post Question` ，这是给出错误消息格式不正确的代码，所以我将它们作为图片包含在内. __现在我把我的一部分代码放在那里。我也更新了我的问题，请让我知道我现在包含在更新部分中的查询。

标签： c# asp.net-mvc highcharts

【解决方案1】：

您需要将时间格式化为以毫秒为单位，这需要两件事，一是设置类型datetime：

xAxis: {
  type: 'datetime',
  ...
}

并修复获取时间戳的函数，如下所示：

for (i = 0; i < signals.DeviceSignalDataGroupList.length; i++) {
  ddd[i] = [];
  var DeviceSignalModel = signals.DeviceSignalDataGroupList[i];
  name.push(DeviceSignalModel[0].SignalName);

  $.each(DeviceSignalModel, function () {
    ddd[i].push([(new Date(parseInt((this.SignalData.TimeReceived).replace('/Date(', '')))).getTime(), parseInt(this.SignalData.Value)]);  // changed toLocaleString() to getTime()
  });

  ddd[i] = ddd[i].reverse();
}

【讨论】：