0

我在使用以下代码时遇到了问题。我已经尝试了很多东西，并在高处和低处寻找答案，但无济于事。这是我要绘制的数据：https ://gist.github.com/caffinatedmonkey/5714631

它是以下格式：

{
    "x":[1,2,3,4,5,6,7],
    "y":[8,9,10,11,12,13,14]
}

它符合 JSONLint 验证工具，所以我很确定数据不是问题。

代码的要点在这里：https ://gist.github.com/caffinatedmonkey/5714631

在这个应用程序中，我使用了 d3.v3.min.js javascript 库。我想知道如何用 D3 绘制这些数据，如果可以，如何？

4

2 回答 2

1

d3 在处理对象数组时效果最好。我建议重组您的原始数据，使其看起来像这样：

[{x:1, y:2}, {x:2, y:100}, {x:3, y: 321}, ect}]

马上，

.selectAll("li")
.data(data)

将数据数组的每个元素连接到一个“li”元素。由于数据如下所示：

[
    "x":[1, 2, 3, ect], 
    "y:[2, 100, 321, ect]
]

只有两个元素要加入，“x”和“y”。当您尝试查找每个元素 x 属性时

.text(function (d, i){
        console.log(d.x[i]);

它不存在，因为 'd' 只是一个数组。

于 2013-06-05T17:36:25.090 回答
0

由于 d3 最适用于对象数组，因此最好重构原始数据。如果重组原始数据不是一个选项，您可以在运行时即时重组数据。这个小提琴中的代码应该可以解决问题。

如果您不想更改数据，您也可以在更改某些部分脚本时按原样使用它。而不是传递data给.data()函数 passdata.x或data.y. 如果你这样做，你可以通过Here is a fiddle来查看相应的元素。data.x[i]

于 2014-01-04T00:36:27.217 回答