使用人力车绘制时间序列图.输入数据的格式

Chart with time series using Rickshaw. format of input data

本文关键字：输入 数据 格式 时间序列 人力车 绘制      更新时间：2023-09-26

我愿意用Rickshaw绘制一张图表（javascript库与D3一起工作）。我的数据如下：

var data = [{x : '10:16:00', y : 35.75}, {x : '10:17:00', y : 35.78},  {x : '10:18:00', y : 31.04}];

但这对于像这样的简单代码是不起作用的

var graph = new Rickshaw.Graph( {
    element: document.querySelector("#chart"), 
    width: 200, 
    height: 200, 
    series: [{
        color: 'steelblue',
        data: data
    }]
});
graph.render();

读取数据时出现错误消息。在我看来，这个问题是由于我上面的x是字符串，而不是递增整数。

我必须将x转换为某种javascript时间格式吗？我该怎么做？

您需要将x-axis定义为时间轴：

var xAxis = new Rickshaw.Graph.Axis.Time({
    graph: graph,
});
xAxis.render();

然后，您将x轴数据作为（第一个）：

new Date(2014, 11, 4 , 10, 16, 0, 0).getTime()

或者使用一些其他CCD_ 9构造函数。

相关文章：