我正在尝试一些基本的d3,我一直在尝试使用d3获取每个rect的属性,但我无法得到任何东西.
当我尝试d3.selectAll(“rect”)时,我明白了
如何使用d3.selectAll(“rect”).select(“part1”).attr(…)或类似的东西来访问rect的属性？我想访问所有rect的不同属性.
解决方法
您可以使用getter获取元素的任何属性：
d3.select(foo).attr("bar")
这基本上只是一个参数的attr()函数.
这是一个演示.有两类矩形,第1部分和第2部分.我正在选择所有part1矩形并得到它们的x位置：
var svg = d3.select("svg");
var rects = svg.selectAll("foo")
.data(d3.range(14))
.enter()
.append("rect")
.attr("fill","teal")
.attr("y",20)
.attr("x",d => 10 + 12 * d)
.attr("height",40)
.attr("width",10)
.attr("class",d => d % 2 === 0 ? "part1" : "part2");
d3.selectAll(".part1").each(function(d,i) {
console.log("The x position of the rect #" + i + " is " + d3.select(this).attr("x"))
})
<script src="https://d3js.org/d3.v4.min.js"></script> <svg></svg>
