javascript - 当 D3 中有 Data 对象时，如何找到关联的 DOM 元素？

Question

我有大约 20-30 个“矩形”对象，它们包含在类“barsGroup”的组中，在我的 D3 中，每个对象都有绑定(bind)到它们的关联对象。绑定(bind)对象有一个 id 字段，该字段是 UUID。

当我只有 Object.select 语句时，任何人都可以帮助我找到关联的“矩形”DOM 元素吗？我所有绑定(bind)的对象都在“data”数组中；

我已经尝试过

d3.select("#barsGroup").selectAll("rect").data(data).filter(function(d){return task.id === d.id})[0] [0];

虽然这似乎适用于大多数元素，但对其他元素来说却很困惑。有人可以阐明我做错了什么吗？

我的方法很可能是错误的。

本质上我有一个看起来有点像这样的对象:

{"id":"c",
 "parents":["a","b"]
}

每个 a、b 和 c 数据对象都已绑定(bind)到矩形。

我现在尝试从绑定(bind)到“c”的矩形的边界框到绑定(bind)到父级“a”和“b”的矩形绘制箭头。

我正在寻找如何使用对象“a”中的 id 来获取由对象“a”绑定(bind)的 DOM 矩形。

Answer 1

如果您需要节点，无需破解 API，请使用 node 方法...

var myRect = d3.select("#barsGroup").selectAll("rect").filter(function(d){return task.id === d.id}).node();