New call-to-action

The goal is to turn data into information and information into insights. (Carly Fiorina, Former Executive, HP)

Data scientists have a tough job — no matter how bad or dirty data is, we need to come up with ways to make the data consumable. At SocialCops, we’ve been building tools that allow the most complicated data sets to be visualized in the most simple ways. In the search to make data digestible, we discussed and debated which is the best tool for presenting our insights. I spent some time dabbling with two tools in the market — Google Charts and D3.js — and hope to review both tools objectively through this blog post.

This review is just a view of my own google searches, opinions, and experiences, so please feel free to give suggestions, advice, or opinions in the comments section below.

What is Google Charts?

Google Charts is a Google product that contains various charts ranging from the simplest line graph to a complex hierarchical tree map. With ready-to-use examples for all the charts and easy-to-implement features like embedding and exporting charts as pngs, Google Charts have come a long way since it was introduced in 2007.

Data Driven Documents, D3.js Versus Google

What is D3.js? 

D3.js is a different kind of tool altogether. It is not a core charting tool, actually. As the name suggests (Data Driven Documents), it’s a library used to manipulate DOM objects using data. D3.js offers extraordinary flexibility and doesn’t tie you to a strict framework, letting you implement creative, complex thoughts on data visualization.

data driven documents, d3.js versus google 101

Advantages of Google Charts over D3.js

  • Google Charts can’t create many variety of graphs when compared to D3.js; but what it can complete, it does it perfectly.
  • It has a very easy-to-use API, compared to D3.js where you have to build every axis, line, and bar from scratch. In Google Charts, just call the graph, enter the data correctly, customize the style and bingo, you are done.
  • Google Charts can be picked up by a non-tech person, but the same can not be said for D3.js, where at least some basic knowledge of JavaScript is required to start making graphs. Learning D3.js will a take lot of time.
  • Google Charts has a big plus point as you can easily export charts to pngs. We can achieve the same effect in D3.js with some tweaks, but there is no direct and easy support from D3.js.

New call-to-action

Advantages of D3.js over Google Charts

  • One of the major points in favor of D3.js is that you can make your visualizations the way you want. This is not possible in Google Charts, where you can only create frequently used charts like bar, line, column, etc.
  • While some of the Google Charts do not support a large amount of data and have some limit, D3.js can be used for data ranging from bits to gigabits and it will still go strong.
  • Even with the general graphs, you can add many other DOM functions in D3.js like zoom or click functions for any graph you want, which is not quite possible for all the Google Charts.

Google Charts are best for those who want basic and simple graphs without wasting much time. D3.js graphs are for those who want to create complex, customized graphs. The learning process for D3.js can be slow, but, once you get used to it, D3.js is a lot of fun to play around with. On a lighter note, I would like to say that Google Charts are for those who use Windows OS and D3.js are for those who use Linux/Unix OS. And about Mac OS users? I think they are smart enough to choose which one is best for them 😉

P.S. I love Ubuntu.

We’re always looking for new team members. Think you’d be a good fit? Check out our open positions here!

New Call-to-action