Comment by Billy Kwok on "How do I go about having D3.js with React?"

I used D3 and React together in 2 previous projects. D3 is nothing more than just a data-to-svg rendering lib with some interaction support. Basically, the way u use D3 and React together depends on what kinds of visualization you are building.

For most of the visualization, they works perfectly well together in two ways -

Using original D3 API (e.g. select) inside componentDidMount() via DOM ref.
A better solution: Write your own svg tag rendering code and only use the data processing part of D3. This allows u to write D3 in the React style and give its control to React.

BUT!!!!!!!!!!!!!!!!!!!!!!!!!!!!! For option 2, if you would like to make something that requires Click/Hover/Pan and Zoom, you have to write your own event listener and zooming logic (I did it).

For both options, if you would like to make something that requires Drag and Drop, sorry, you cannot use D3 together with React because the way D3 manipulate dragging objects conflicts with React.

Search Hashnode