javascript - JQuery Flot 未在 x 轴上显示正确的时间

标签 javascript jquery flot

我的图表无法正确解析时间。 x 轴由 unix 时间戳组成,我的目标是在用户本地时间中以 M-D 格式显示它。由于某种原因,所有日期都显示为 01/18

JSFiddle 的完整代码:http://jsfiddle.net/v49wqvfv/3/

图形代码:

    var data = [[1492854610, -1240],[1492939020, -1273],[1493025073, -1279],[1493117066, -1186],[1493198484, -1269],[1493289175, 1198],[1493370646, -1280],[1493458518, -1255],[1493543731, -1275],[1493630250, -1273],[1493716306, -1279],[1493803609, -1264],[1493889258, -1276],[1493975557, -1278],[1494064529, -1235],[1494155440, -1160],[1494237980, -1224],[1494321047, -1280],[1494407990, -1271],[1494494125, -1275],[1494581609, -1257],[1494668321, -1252],[1494753220, -1277],[1494847855, -1140],[1494925963, -1278],[1495012537, -1275],[1495099289, -1269],[1495188205, -1227],[1495273568, -1244],[1495358329, -1272]];

    var ticks = [];
    var abovePoints = [];
    var belowPoints = [];

    for (var i = 0; i < data.length; i++) {
        ticks.push(data[i][0]);
    }

    data = [
        { label: null, data: data, points: {show:false} },
        { label: null, data: data, points: {show:true},  lines: {show:false}}
    ];

    $.plot('#placeholder', data, {
        grid: { 
        hoverable: true, 
        markings: [
            { color: '#000', lineWidth: 1, yaxis: { from: 0, to: 0 } },
                    ]          
        },
        series: {
            color: '#f36b6b',
            lines: {
                show: true,
                fill: true
            },
            points: {
                show: true
            },
            threshold: {
                below: 0,
                color: '#56af45'
            }
        },
        xaxis: {
               mode: "time",
               timeformat: "%m-%e"
        }
    });

最佳答案

JavaScript 时间戳以毫秒为单位,而 UNIX 时间戳以秒为单位。您需要将时间戳乘以一千:

        var data = [[1492854610000, -1240],[1492939020000, -1273],[1493025073000, -1279],[1493117066000, -1186],[1493198484000, -1269],[1493289175000, 1198],[1493370646000, -1280],[1493458518000, -1255],[1493543731000, -1275],[1493630250000, -1273],[1493716306000, -1279],[1493803609000, -1264],[1493889258000, -1276],[1493975557000, -1278],[1494064529000, -1235],[1494155440000, -1160],[1494237980000, -1224],[1494321047000, -1280],[1494407990000, -1271],[1494494125000, -1275],[1494581609000, -1257],[1494668321000, -1252],[1494753220000, -1277],[1494847855000, -1140],[1494925963000, -1278],[1495012537000, -1275],[1495099289000, -1269],[1495188205000, -1227],[1495273568000, -1244],[1495358329000, -1272]];

请参阅documentation了解更多信息。更新 fiddle :http://jsfiddle.net/v49wqvfv/4/

关于javascript - JQuery Flot 未在 x 轴上显示正确的时间,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44125127/

相关文章:

javascript - PHP/SQL 从 SQL 表中获取正确的数组

javascript - 如何在浮点图中间隔刻度?

javascript - Flot Graph TickLabel 和 Tick 定位问题

jquery - 主体的wrapInner()直到指定元素

jquery - 使用 jquery 文件上传插件并行分块上传文件

javascript - Flot.js 设置 y 轴标签格式以显示两位小数

javascript - 在窗口大小调整时显示不同的JS动画

javascript - 将 javascript 与 jquery 混合

javascript - 为什么有些原型(prototype)函数重写可以工作,而另一些则不行?

javascript - 第一次尝试时未出现 JQuery FadeOut 函数