I love D3. D3 is amazing at making charts. D3 code is also quite hard to write – the learning curve is steep, and using the library expertly also requires expert knowledge of SVG. Instead of reinventing the wheel, here are reusable D3 charts I made while working on client projects at Springload.

We’ve been trialing new front-end tools and libraries over 2015 but our main stack has remained very stable. Starting a new project? Here are Springload’s picks, all available in our front-end starter kit.

Lately I’ve been very interested in the topic of exporting PNG or SVG assets from D3 charts created with SVG and CSS. This is a very important topic because those exports are often a big selling point of paid data visualizations libraries, and rightfully so – you can’t reuse a dynamic D3 chart as easily as a static asset.

Here is a quick example of allowing interaction with specific lines in a D3 chart. The lines take up very little space, so we render a transparent interactive overlay on top on which the event handlers are bound.

Here is a small talk I gave at the Wellington React Meetup about using React in an agency.