Question

我有以下问题，如下图所示，水平刻度似乎是随机的，不要尝试与数据对齐。我的数据和代码也在下面。对此有任何帮助表示赞赏。

图片位于http://imgur.com/VVrvi（抱歉无法附加图片）

代码：

    $.plot(placeholder,
            data, 
            {
               yaxes: [ { tickFormatter: centFormatter, max: 101, min: -0.1, tickSize: 20 }, { position: "right", min: -0, } ],
               xaxes: [ { mode: "time", minTickSize: [1, "day"],  } ],
               series: {
                   lines: { show: true },
                   points: { show: true }
               },
               grid: { hoverable: true, clickable: true },
    });

蓝线数据：

[2012-08-19] => 3612220
[2012-08-26] => 3570080
[2012-09-02] => 3576040
[2012-09-09] => 3597380
[2012-09-16] => 3593040
[2012-09-23] => 3579480
[2012-09-30] => 3638840
[2012-10-21] => 13

我已经为ticks，minTickSize等尝试了各种选项..没有运气。

Answer 1

问题是您的日期数据来自您服务器的时区，然后在浏览器中通过flot以UTC格式呈现。您需要仔细阅读documentation的时间序列数据部分。

默认行为是Flot始终根据显示时间戳世界标准时间。原因是核心Javascript Date对象没有支持其他固定时区。通常，您的数据是在另一个时间区域，所以可能需要一些调整来解决这个问题限制。

想象一下，您的服务器的时区是UTC + 8小时。当您在服务器上为2012-08-19创建时间戳时，实际得到的是2012-08-19上午8点。解决此问题的最简单方法是生成UTC时间戳（可以使用多种语言编写，并在flot文档中给出示例）。如果这是不可能的，只需在生成的时间戳中添加正确的毫秒数，在我们的示例中，就像这样（在伪代码中）：

myTz = new Date('2012-08-19').toTimestamp(); //this is 8am on the 19th in milliseconds
myTz = myTz - 8*60*60*1000; //this is 8 hours

Flot - x轴刻度不符合实际数据

1 个答案: