为什么我在这里看不到日志?我将数据附加到父组中,正在创建的子组应该继承它,对吗?
在这里,我创建一个新的 SVG 组,并附加数据,并且对于每个数据单元,我希望创建一个组。请帮我找到我失踪的地方?
代码::
var svg = d3.select('body')
.append('svg')
.attr('width', 600)
.attr('height', 300)
.data([[20,30],[40,50]]);
var g = svg
.selectAll('g')
.enter()
.append('g');
g.each(function (d, i) {
console.log(d, i)
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.4.0/d3.js"></script>
最佳答案
I am attaching the data in the parent and the child group being created should inherit it, right?
他们确实继承了。您可以将数据添加到 SVG 并根据它进行分组,这不是问题。这里的问题只有两件事:
首先,对于您想要的结果(“第一个 g 应具有 [20, 30],第二个 g 应具有 [40, 50]”),这应该是数据:
.data([[[20,30],[40,50]]]);
其次,您必须引用父级的数据来创建您的 <g>
s:
.data(d => d)
这是演示:
var svg = d3.select('body')
.append('svg')
.attr('width', 600)
.attr('height', 300)
.data([[[20, 30],[40, 50]]]);
var g = svg
.selectAll('.g')
.data(d => d)
.enter()
.append('g');
g.each(function(d,i) {
console.log(d,i)
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>
关于javascript - d3.js 中未发生数据级联,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41281941/