2

我正在尝试使用 D3.js 创建折线图,但我很困惑。我已按照本教程进行操作,但我不知道如何将数据放入图表中。

这是我的数据的样子:

[
    { name : "SomeKey", timestamp : "2013-05-07T12:00:00.052Z", value : "1" }
    { name : "SomeKey", timestamp : "2013-05-07T12:10:00.052Z", value : "4" }
    { name : "SomeKey", timestamp : "2013-05-07T12:40:00.052Z", value : "2" }
    { name : "SomeKey", timestamp : "2013-05-07T12:41:00.052Z", value : "2" }
    { name : "SomeKey", timestamp : "2013-05-07T12:44:00.052Z", value : "2" }
    ... etc. there can be loads of objects in this array
]

如前所述,数组中可以有任意数量的对象,name键始终为数组保存相同的值,我需要的是 x 轴上的时间戳,值是绘制图表的值,但我不能很清楚。

我在 SO 上查看了可能与此问题类似的其他几个问题,但对我而言,不同之处在于每个对象只有一个值。

4

1 回答 1

0

您需要进行一些更改以指定您希望数据基于的对象中的属性,在您的情况下为“值”。

首先获得最大 Y。

maxY = d3.max(data, function (d) {
    return d.value;
});

您想修改教程中的这一行并将 d3.max(data) 替换为 maxY。

y = d3.scale.linear().domain([0, d3.max(data)]).range([0 + margin, h - margin])

然后,您还需要修改此代码以指定您的值

var line = d3.svg.line()
   .x(function(d,i) { return x(i); })
   .y(function(d) { return -1 * y(d.value); })
于 2013-05-26T15:50:45.677 回答