Comparison between d3.js and chart.js (only for charts) [closed]

d3.js is not a “charting” library. It is a library for creating and manipulating SVG/HTML. It provides tools to help you visualize and manipulate your data. While you can use it to create conventional charts (bar, line, pie, etc…) it’s capable of so much more. Of course with this “capable of so much” comes a steeper learning curve. There are a lot of conventional charting libraries built on top of d3.jsnvd3.js, dimple.js, dc.js if you want to go that route.

I’m not familiar with Chart.js but a quick look at the website tells me it’s more of a run of the mill charting library. It supports 6 basic chart types and you aren’t ever going to do stuff like this with it. But the API looks straightforward and I’m sure it’s easy to use.

Other than that the most obvious distinction between the two is that Chart.js is canvas based, while d3.js is mainly about SVG. (Now I say mainly because d3.js can manipulate all types of HTML elements so you could even use it to help you draw on a canvas.) In general canvas will out perform SVG for a large number of elements (I’m talking very large – thousands of points, lines, etc…). SVG, on the other hand, is easier to manipulate and interact with. With SVG each point, line, etc becomes part of the DOM – you want that point green now, just change it. With canvas its a static drawing that was to be redrawn to make any change – of course it draws so fast you’ll usually never notice. Here’s some good reading from Microsoft.

Leave a Comment

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)