jQuery Flot：24小时轴 [英] jQuery Flot: 24 hour axis

问题描述

我正在使用 。

I'm using jQuery Flot plugin and I would like to have 24 hour x-axis. But how to accomplish that? I included necessary time plugin (jquery.flot.time.js) and tried something like this:

xaxis: {
    mode: "time",
    timeformat: "%H",
    tickSize: [1, "day"],
    twelveHourClock: true
}

but nothing is showing up. What am I doing wrong?

解决方案

You are looking for something like this:

xaxis: {
    mode: "time",
    timeformat: "%I:%M %p", // HH:MM am/pm
    tickSize: [1, "hour"], // tick every hour
    twelveHourClock: true,
    min: 1390780800000, // start of today
    max: 1390863600000 // end of today
},

Very contrived example here.

EDITS

To show last 24 hours use:

var epochT = (new Date).getTime(); // time right now in js epoch

$.plot($("#placeholder"), [data], {
xaxis: {
    mode: "time",
    timeformat: "%I:%M %p",
    tickSize: [1, "hour"],
    twelveHourClock: true,
    min: epochT - 86400000, // time right now - 24 hours ago in milliseonds
    max: epochT,
    timezone: "browser" // switch to using local time on plot
},

Updated fiddle.

这篇关于jQuery Flot：24小时轴的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！