如何在人力车的X轴上绘制日期

Question

我有一组日期数据.我应该提供X轴值的值是多少？如何让人力车将X数据值显示为日期？

我环顾了文档和示例,找不到任何东西.

Answer 1

我刚刚开始使用人力车并处于确切的情况.

但是,在我进一步发展之前,Rickshaw文档实际上是不存在的,这非常令人沮丧,因为人力车与其他JS图形库相比的表现非常出色.

找到示例的最佳方法是深入了解源代码和github页面上的示例代码,尝试理解事物(而不是文档的方式).

话虽如此,让我们尝试在StackOverflow上建立一个强大的问题/答案基础!

所以,回到问题:)看起来你已经找到了自己的问题解决方案,但我也会提供我的解决方案.

而不是使用Rickshaw.Graph.Axis.Time,我已经使用Rickshaw.Graph.Axis.X和设置tickFormat相应的.

var data = [ { x: TIME_SINCE_EPOCH_IN_SECONDS, y: VALUE }, 
             { x: NEXT_TIME_SINCE_EPOCH_IN_SECONDS, y: NEXT_VALUE } ]

var xAxis = new Rickshaw.Graph.Axis.X({
  graph: graph,
  tickFormat: function(x){
                return new Date(x * 1000).toLocaleTimeString();
              }
})
xAxis.render();

toLocaleTimeString()可以是任何Javascript日期函数,例如toLocaleString(),toLocaleDateString(),toTimeString()或toUTCString().显然,因为tickFormat将函数作为参数,所以可以提供自己的格式化程序.

Koliber,如果你能提供更多细节,我有兴趣了解你的答案.

Answer 2

我终于发现 X 轴值应该是纪元时间值。然后，使用示例中的代码，我能够显示正确的时间尺度。

我仍然有一个问题，因为我想在 X 轴上显示周的刻度线。但是，将 timeUnit 设置为“week”会导致 JavaScript 错误。但它适用于其他时间单位。