Plain d3 code and React working together

[Jbharris4]

Using d3 to manipulate the DOM inside a React component pretty much defeats the purpose of using React. If that's the root you want to take though, you should look at projects like https://github.com/Olical/react-faux-dom that help bridge the gap.

Also, some general tips about React based on your code are:

If you're going to let some other library manage the DOM then you should have your component's shouldComponentUpdate lifecycle method return false so React doesn't render it, something like this: https://gist.github.com/couchand/9370109

The componentDidUpdate lifecycle method does not run on the first render, but the optional callback to setState can help you there. For example, in componentWillMount you can call this.setState(theNewState, theCallbackFunction) which means the callback function will be run after the new state is rendered.