QueueHammer QueueHammer - 1 month ago 22
Javascript Question

A d3.select... equivalent to jQuery.children()

I'm using d3 to append some elements on enter() and then update them later. However, the next time i try to select those elements the selection is much larger than the original. This is because the original selection elements now have children that are the same type e.g.;

<g>
,
<svg>
. I expected selectAll() to only work at the first decedent level like jQuery.children() is there an equivalent in d3? If not whats the most efficient way to shim that?

Answer

There's no equivalent to jQuery.children(). This is usually handled by assigning a distinguishing class to the elements you want to select together, e.g. something like this.

svg.selectAll("g").data(data)
   .enter()
   .append("g")
   .attr("class", "parent")
   .append("g")
   .attr("class", "child");

svg.selectAll("g"); // all g elements
svg.selectAll("g.parent"); // only parents
svg.selectAll("g.child"); // only children