/ react

D3 transition in React

Quick and dirty demo of how to get D3 to control the DOM for transition: https://codesandbox.io/s/9o08x4kw0w

This is the magic part in components/Square/index.js.

let node = d3.select(ReactDOM.findDOMNode(this));

ReactDOM.findDOMNode basically allows you to get the DOM element and lets you manipulate it as you would without React.

I think this would be helpful too if you're using external jQuery libraries and needs get a handle on the DOM element.

There are other react-ish methods involving react-transition-group and making using of react's life cycle methods, but I have not looked into.

D3 transition in React
Share this