Hacker News Reader

Comment by molloy | Hacker News Reader

I just started learning d3 today for a work project, and yeah the selections and `data()`, `enter()`, `exit()` definitely add some cognitive overhead. Now that I've (mostly) wrapped my head around it, I like it a lot (and I'm also happy with d3's documentation!) Have you used react-faux-dom? [0] I've only just started using it, but so far it feels like a good solution for marrying react and d3.

[0] https://github.com/Olical/react-faux-dom

View on HN

Having gone through the process of marrying react and d3 - IMHO it's far easier to let react do DOM diffing and manipulation, and let d3 worry about data processing. The two work great together, just so long as you don't try to shoehorn one into the other. React more or less mirrors data(), enter(), and exit() with props, componentDid(/Will)Mount, and componentWillUnmount

This may be too late for you, but this is a great library that marries d3 with React. https://github.com/tannerlinsley/react-charts

Yeah, that does exactly the thing I was describing from a quick skim. https://github.com/uber/react-vis does it as well. I've found that attempting to wrangle one of these chart libs takes more time than a quick `myData.map(d => <line path={linefunc(d)}/>)` or similar.

Having officiated the same kind of union between Ember and D3 in a few different ways, I have to agree - let Ember handle rendering, and D3 handles dynamic data binding. I've been working on an open source Ember library based on these concepts: http://locusenergy.github.io/ember-sparkles/#/sine-wave

Reply on news.ycombinator.com