Show HN: A JavaScript library for data visualization in both SVG and Canvas

161 points

2 years ago

Here's a project I've been working on for a little while now. Ripl is a JS library that provides a unified API for rendering shapes on both canvas and SVG interchangeably. Over the years I've used D3 extensively to create data visualisations so I figured I'd have a go at making my own version with a slightly more modern API and stricter TypeScript support.

I am aware there are already libraries that can draw to multiple contexts interchangeably, but I've added a few little niceties to Ripl that (as far as I know) some other libraries don't have such as CSS-like query selectors, DOM-like event bubbling, and keyframe animation support.

The project is far from done and not published to NPM yet, but there are a few demos and source that you can look at in the repo.

I'm happy with how it has come along and the things I've learnt along the way, especially the math. My dream would be to one day work on this full-time and build out a full data-viz library.

35 comments