Skip to content Skip to sidebar Skip to footer

Programmatically Opening D3.js V4 Collapsible Tree Nodes?

I have modified d3noob's d3.js version 4 https://bl.ocks.org/d3noob/43a860bc0024792f8803bba8ca0d5ecd derivative of Mike Bostock's collapsible tree https://bl.ocks.org/mbostock/4339

Solution 1:

Can be done by triggering a click event on a specific node. Here is an example of expanding the node "Analytics" few seconds after initial render.

First, assign a unique attribute (or class name or id) to every node to find it in the DOM:

node.enter().append('g')
  .classed('node', true)
  .attr('node-name', d => d.data.name)
  ...
  .on('click', click);

Then, trigger a click event on a specific node:

d3.select('.node[node-name="analytics"]').node().dispatchEvent(new Event('click'));

Post a Comment for "Programmatically Opening D3.js V4 Collapsible Tree Nodes?"