finds.dev← search

// the find

codesuki/react-d3-components

★ 1,616 · JavaScript · MIT · updated Jan 2022

D3 Components for React

A React wrapper around D3 v3 that keeps D3 out of the DOM by rendering chart elements as React components. Covers the standard chart types — bar, line, area, scatter, pie, and a waveform view. Aimed at React projects that want D3's math without D3's direct DOM manipulation.

The core idea is sound: using D3 only for scales and math while React owns the SVG elements avoids the usual fighting between D3's enter/update/exit pattern and React's reconciler. Custom accessor functions mean you can feed it whatever data shape you already have without reformatting. The brush component wired to chart scales is genuinely useful for date-range filtering and not trivial to build yourself. CSS class hooks on every element mean you can style charts without touching component internals.

This is D3 v3, which is years behind — d3.scale.ordinal(), d3.time.scale(), React.createClass() in the examples are all deprecated or removed APIs. Last commit was January 2022 and the README opens with a plea for maintainers, so any bug you hit is yours to fix. No animation support at all, and the legend was still on the todo list when development stopped. The Brush component requires you to manage scales manually in component state rather than wiring up declaratively, which is awkward in modern React.

View on GitHub → Homepage ↗

// want more like this?

We dig through GitHub every week and send a few repos picked for what you actually care about — each with an honest take like this one.

Get finds in your inbox → Search again →