如何从d3节点数据中获取dom svg元素？

Question

我有nodes变量，它是一个包含图中所有节点的数组。 每个节点在DOM中都有一个SVG g （组）SVG元素。

要选择具有DOM元素的数据，我执行d3.select(myElement).data()[0] ，但是如何获取具有数据的DOM元素？

Answer 1

您可以使用D3的数据匹配来完成此操作。 我们的想法是让数据为您“识别”正确的元素。

d3.selectAll("allMyElements").data([datumIwantElementFor], suitableKeyFunction);

在这里完成演示。

需要说明的是，我不建议采用这种方法。 当您向文档添加更多元素并意外选择其中一些元素，在多个位置使用相同数据或更改数据格式时，这很容易破坏。 它会导致很难发现的错误，除非你知道你在寻找什么。

更好的方法是将数据中的ID或类分配给绑定数据的每个元素，以便在获得数据时可以直接选择它。 这也会更有效率。