Making charts with C3

I am a big fan of Data-Driven Documents, also known as D3, a javascript library developed by Mike Bostock.

Binding to data loaded in through D3 can be quit onerous and requires quite a bit of in depth knowledge of the framework.

Recently, someone has developed a library built on D3 to further abstract web developers from the data-binding that creates beautiful charts and graphs: enter C3.

C3 (based on D3js v3) and it’s brother library (Billboard — the same interface as C3 but based on D3js v4) allow for complex graph rendering with just a handful of lines of code. For instance, I was able to:

• learn the C3 framework
• build my dataset
• generate an interactive line graph

in just one night with fewer than a hundred lines of javascript.

The above below depicts my blood sugar scores over as entered into my Tandem Diabetes t:slim pump from April 2014 to June 2017. Note that the scores look largely out of control, and in a way I suppose that’s not entirely untrue, but it is also worth noting that I typically only enter the “poor” scores into the pump so that it can make corrections for me–the motivation does not exist for scores that fall within the normal range.

Over the course of three years 1412 scores have been uploaded to Tandem’s website.

View chart full screen here.