1

我有一个带有时间序列的jQuery 浮点图表,其中第一个 x 轴刻度未对齐(溢出图表边框)。该图表具有显示日期的自定义刻度。

jsfiddle

var options = {
    xaxis: {
        mode: "time",
        timeformat: "%Y-%m-%d",
        ticks: [1372636800000, 1372723200000, 1372809600000] 
    },
    yaxis: {
        tickLength: 0
    },
    legend: {
        show: false
    }
};

var readings = [
    {
        "label": "Trend 1",
        "data": [
            [
                1372636800000, //Mon, 01 Jul 2013 00:00:00 UTC
                2.65
            ],
            [
                1372723200000, //Tue, 02 Jul 2013 00:00:00 UTC
                0.13
            ],
            [
                1372809600000, //Wed, 03 Jul 2013 00:00:00 UTC
                0.51
            ]
        ]
    },
    {
        "label": "Trend 2",
        "data": [
            [
                1372636800000, //Mon, 01 Jul 2013 00:00:00 UTC
                2.19
            ],
            [
                1372723200000, //Tue, 02 Jul 2013 00:00:00 UTC
                1.56
            ],
            [
                1372809600000, //Wed, 03 Jul 2013 00:00:00 UTC
                1.42
            ],
        ]
    }
]

$(function () {
    $.plot($("#chart"), readings, options);
});

在此处输入图像描述

据我所知,时间戳正确表示 UTC YYYY-MM-DD 00:00:00。

导致错位的原因是什么?我该如何解决?

4

1 回答 1

3

图表边框左侧的线不是第一个 x 轴刻度(当您将第一个刻度更改为 eg 时可以看到1372642800000)。

该线属于 y 轴刻度,您将其设置得如此之小以至于它们不可见。如果将 y 轴更改tickLength为 3,您会看到细线上的刻度。如果您将 更改tickLength为超过 5,您只会看到刻度线本身并且线条消失了。(对于其他样式,请查看tickLength: null或负值。)

要在没有线条的情况下获得不可见的刻度,您可以使用tickLength: 6, tickColor: 'white'. 更新小提琴

于 2013-08-13T21:57:06.993 回答