【问题标题】:jquery flot xaxis timejquery flot xaxis时间
【发布时间】:2010-03-24 11:33:52
【问题描述】:

在这个例子中,xaxis 将比较天...

$.plot($("#placeholder"), data, {
                yaxis: {},
                xaxis: { mode: "time",minTickSize: [1, "day"],timeformat: "%d/%m/%y"},"lines": {"show": "true"},"points": {"show": "true"},clickable:true,hoverable: true
            });

如何打印时间?

这是我想要的结果:

22:00 23:00 00:00 01:00 02:00 ...... 23:00 00:00 01:00 02:00 .... 06:00

有可能吗?

【问题讨论】:

    标签: jquery flot


    【解决方案1】:

    来自 Flot 的 Api 官方文档:(见https://github.com/flot/flot/blob/master/API.md

      xaxis: {
        mode: "time",
        timeformat: "%y/%m/%d"
      }
    

    这将产生像“2000/12/24”这样的刻度标签。以下 支持说明符

     %h: hours
      %H: hours (left-padded with a zero)
      %M: minutes (left-padded with a zero)
      %S: seconds (left-padded with a zero)
      %d: day of month (1-31), use %0d for zero-padding
      %m: month (1-12), use %0m for zero-padding
      %y: year (2 digits)
      %Y: year (4 digits)
      %b: month name (customizable)
      %p: am/pm, additionally switches %h/%H to 12 hour instead of 24
      %P: AM/PM (uppercase version of %p)
    

    【讨论】:

    • SUPER NIT PICK,“时间”后面需要一个逗号。
    • 我很确定捕获抛出异常的错误不是超级挑剔。
    • 另一个超级挑剔的选择:如果您要引用官方文档,指向它们的链接会有所帮助。 :)
    • %y 给我 2 位数年份。
    • @Margo 在最新版本的 flot 中使用 %Y 代表四位数字和 %y 代表两位数字年份。
    【解决方案2】:
    $.plot($("#placeholder"), data, {
            yaxis: {
            },
            xaxis: { mode: "time",minTickSize: [1, "hour"],
                    min: (new Date("2000/01/01")).getTime(),
                    max: (new Date("2000/01/02")).getTime()
    },
            "lines": {"show": "true"},
            "points": {"show": "true"},
            clickable:true,hoverable: true
    });
    

    以此为起点,你可以在这里看到结果http://jsfiddle.net/UEePE/

    【讨论】:

    • 您的小提琴在当前 Chrome 中没有显示任何行