在jQuery flot中显示y轴上的小时数

Question

我做了一个图表，我在y轴上显示小时数。但现在我必须将时间转换为小数。

2:30将是2.5

我知道您可以将y轴设置为时间模式，但我无法使其工作：

        yaxis: {
            mode: "time",
            timeformat: "%H:%M"

        },

但是我应该如何将时间交给jQuery Plot：“1:40”不起作用

我想用几个小时而不是几分钟来看这个方式

我在互联网上寻求帮助，jQuery API没有正确解释： http://flot.googlecode.com/svn/trunk/API.txt

非常感谢你的帮助！

Answer 1

你想要做的就是使用轴tickFormatter伪造它。 “时间”模式应该被称为“日期”模式，因为它是关于日期而不是时间。时间真的很偶然。因此，如果您已经在完成将时间转换为小数的工作，只需使用javascript函数将它们转换回您想要的格式：

function timeTickFormatter(val,axis) {
  var hours = Math.floor(val);
  var minutes = (val - hours) * 60;

  return hours+":"+minutes;
}

这并没有明显涵盖所有的排列（如果你想要它们就是前导零），但这就是主意。如果你不知道如何将它放入flot中，那么你的情节选项就是这样：

$.plot(placeholder, data, {
  ..,
  yaxis: {
    ..,
    tickFormatter:timeTickFormatter,
    ..
  }
});