试图了解如何应对D3嵌套数据,我想出了这个例子:D3.js - 嵌套数据的作品,但选择不遵循
<script>
data = [
{ Name: "jim", color: "blue", Points: [{x:0, y:5 }, {x:25, y:7 }, {x:50, y:13}] },
{ Name: "bob", color: "green", Points: [{x:0, y:10}, {x:27, y:30}, {x:57, y:60}] }
];
var print = function(d){d3.select("body li")
.selectAll("b")
.data(d)
.enter()
.append("b")
.text(function(i){return ' - ' + i.x;});}
d3.select("body")
.selectAll("li")
.data(data)
.enter()
.append("li")
.text(function(d){print(d.Points);});
</script>
我本来期望这产生这样:
<li>
<b> - 0</b>
<b> - 25</b>
<b> - 50</b>
</li>
<li>
<b> - 0</b>
<b> - 27</b>
<b> - 57</b>
</li>
而是产生如下:
<li>
<b> - 0</b>
<b> - 27</b>
<b> - 57</b>
</li>
<li></li>
我明白,当我选择“身体里”我本身将现有的两个“li”放在一起,我只给出一个只在第一个“li”中出现的“d”数据,但我真的不明白D3如何在这种情况下工作以及如何遍历“li”。
你原来的方法效果this'给你的函数:HTTPS:/ /jsfiddle.net/nqzak4y4/ –