Interactive Data Visualization with D3.js

Neuroinformatics Working Group, Oct 19

Created by Anisha Keshavan / @akeshavan_
akeshavan.github.io/nhw2017_d3

What is Informatics?

Informatics became a thing when we started collecting lots of data, and it was hard:

1. Our data is too large to comprehend: need to visualize it better
2. Our data is too large to work on alone: need to collaborate

More specifically, D3.js

• stands for Data Driven Documents
• A JavaScript library for manipulating HTML based on data
• There are many beautiful examples
• I like this network diagram

But, its hard

• The examples aren't very reusable
• Not plug and play like ggplot, matplotlib

What about D3-based libraries?

• Plotly
• NVD3
• Dimple
• Vega
• C3.js
• DC.js

These libraries are great to start

• I usually need to tweak them
• The goal is to learn the basic concepts
• Start with an interactive bar plot

Browser Basics:

• HTML: the content
• CSS: the style
• JS: the interaction