在图表中显示 xaxis 标签时,我在使用 Flot 插件时遇到了一些问题。它们是'模式:“时间”'
。目前我将 Flot 与工具提示功能一起使用,工具提示包含日期和时间。
我向包含时间戳的插件提供 JSON。然后,我转换时间戳并将其显示在工具提示中。问题是,在图表中显示数据时,由于时区之间的差异,工具提示中的时间与插件生成的 xaxis 标签不对应。我的 JSON 时间戳是 +2 GMT,但 Flot 中的 xaxis 标签是 +0 GMT。所以我想知道是否有可能设置时区的偏移量或类似的东西。
我的 JSON(由 AJAX 生成)
[1300087800000,29],
[1300088700000,39],
[1300089600000,46],
[1300090500000,53],
[1300091400000,68],
[1300092300000,95],
...
我的工具提示功能
$(placeholder).bind("plothover", function (event, pos, item) {
$("#tooltip").remove();
var x = item.datapoint[0].toFixed(2);
var y = item.datapoint[1].toFixed(2);
var currDate = new Date(Math.floor(x));
var hour = currDate.getHours();
var minute = String("") + currDate.getMinutes();
var tooltip = hour + ":" +
((minute.length < 2) ? "0" + minute : minute) + " " +
(Math.round(y * 100)/100) + "Wh"
showTooltip(item.pageX, item.pageY, tooltip);
});
float 选项
var plotOptions = {
lines: { show: true, lineWidth: 1 },
points: { show: false, symbol: "cross" },
xaxis: {
mode: "time",
tickLength: 5,
timeZoneOffset: (new Date()).getTimezoneOffset()
},
selection: { mode: "x", color: "#BCBCBC" },
grid: { hoverable: true, clickable: false }
};
但不幸的是 timeZoneOffset
不起作用,我在 xaxis 和工具提示之间仍然存在差异。
您对我应该如何解决我的问题有什么想法吗?
最佳答案
您可以尝试使用时区而不是timeZoneOffset。您的选项如下所示:
var plotOptions = {
lines: { show: true, lineWidth: 1 },
points: { show: false, symbol: "cross" },
xaxis: {
mode: "time",
tickLength: 5,
timezone: "browser" // "browser" for local to the client or timezone for timezone-js
},
selection: { mode: "x", color: "#BCBCBC" },
grid: { hoverable: true, clickable: false }
};
我的flot版本是0.7
关于jquery - 使用 Flot jQuery 插件显示带有正确时区的工具提示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5663821/