0

我这里发生了一个奇怪的情况。我已将以下 JSON 传递给时间线控件:

[
  {
    "UserId": 2,
    "ItemId": 3,
    "ItemText": null,
    "ItemDate": "2014-06-09T18:51:37",
    "ItemDateEnd": null,
    "OutcomeScore": null
  },
...
]

这是一个简单的项目数组,我传递给控件以进行渲染。在 Firefox 中,这完美呈现,没有任何问题。但是,我尝试过的所有其他浏览器都会显示项目 +1 小时。我已经在 Opera、Chrome 和 IE9 中尝试过,除了 Firefox 之外,它们都显示出同样的问题。现在时间在所有浏览器上都按预期显示。

有趣的是,我现在正处于格林威治标准夏令时间 +1 小时……但为什么这会选择性地对浏览器产生不同的影响呢?

每个浏览器都运行完全相同的查询并获得完全相同的 JSON。我很困惑,甚至不知道从哪里开始寻找。

我正在运行时间线的 v2.5.0。我已经尝试更新到最新版本并且发生了同样的事情,所以我回滚到 2.5.0 以解决问题,然后再着手将最新版本集成到页面中。

有人看到这个并有解决方案吗?

4

2 回答 2

1

First, note that the Timeline of the CHAP Links library does not support strings as Date, you should provided Dates or a timestamp with a Number (note that the successor of the Timeline, vis.js, does support strings as date). Strings as Date work nowadays because most browsers now support creating dates from an ISO date string.

The issue you have is because you provide an ISO Date String without time zone information. Apparently not all browsers have the same default behavior in that case. Enter the following in a JavaScript console in both Firefox and an other browser:

new Date("2014-06-09T18:51:37").toISOString() 
// output is ambiguous, time zone information missing

and you will see them adding timezone information in different ways. To prevent these kind of ambiguities, you should provide timezone information yourself. To specify the time in UTC, add a Z to the end of the string:

new Date("2014-06-09T18:51:37Z").toISOString()  
// output is unambiguous
于 2014-06-10T10:02:07.690 回答
1

正如您所观察到的,从字符串创建 Date 对象是不可靠的。您应该手动将这些字符串解析为 Date 对象,如下所示:

// assumes date string is in the format "yyyy-MM-ddTHH:mm:ss"
var dateMatch = dataItem.ItemDate.match(/(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2}):(\d{2})/);
var year = parseInt(dateMatch[1], 10);
var month = parseInt(dateMatch[2], 10) - 1; // convert to javascript's 0-indexed months
var day = parseInt(dateMatch[3], 10);
var hours = parseInt(dateMatch[4], 10);
var minutes = parseInt(dateMatch[5], 10);
var seconds = parseInt(dateMatch[6], 10);
var date = new Date(year, month, day, hours, minutes, seconds);
于 2014-06-09T21:46:32.113 回答