D3 circle pack layout hover nodes

Community Help
1

Hello! I am trying to highlight nodes that have no children + their parent nodes, on hover. However, i get an error “d.ancestors() is not a function”. Tried many different ways and researched all I could, but not sure what I am missing.

2

Hey Maria.

Here’s a suggestion that borrows a technique from the d3.hierarchy notebook.

It gets the selected node’s ancestors and uses them to filter the circles before recolouring.

 .on("mouseover", (event, d) => { 
      if(d.height) return;
      const ancestors = new Set(d.ancestors());
      circle
        .filter(d => ancestors.has(d))
        .attr("stroke", "black");
   })
1 Like
3

This makes a lot of sence. Thank you so much!!!