如何從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或類分配給綁定數據的每個元素，以便在獲得數據時可以直接選擇它。 這也會更有效率。