D3 Chart Explorations

Complete this exercise in groups of 3.

Find three D3 visualizations on the D3 Example Gallery. For each of the examples, copy the code required to run it into a new folder in this repo.

If D3 concepts are still fuzzy to you, I suggest starting with a simpler visualization such as those in the Basic Charts or Techniques and Animation section.

Then for all lines of D3-powered JavaScript, comment the line of code to step through what it is doing. Write a new markdown/text file explaining the general flow of data and how it maps into elements in HTML/SVG.

You may encounter problems getting the code to work directly on your machine due to cross site scripting restrictions. This should not prevent you from commenting lines.

Then create a data set that you can host locally to make this visualization work, and attempt to implement a similar visualization with your own code.

The goal here is to read a lot of D3 code, gain a greater understanding of how people think about data, and realize different ways to display this data on the screen with various techniques we haven't explored.

At the end of the lab, you should pick one of the three visualizations as a group to explain/demonstrate to the class.