Welcome to the D3js Workshop!
For rich examples of what D3 is and can do, see the links and visualizations embedded on this page and in the tutorials below, or better yet, go check out the D3 Gallery on the D3 Homepage and Mike Bostocks D3 blocks for an incredible number of fun and engaging interactive graphics.
This series of workshops introduces the fundamentals of D3 from the ground up. We will walk through the process from the start, creating a webpage, adding elements, and binding data to those elements (but not always in that order!). These workshop sessions are designed to complement your other coursework and project work in DUSP and will use a handful of techniques, centered around the D3 library. We will begin with introducing D3, showcasing what it can do, then move into creating charts, graphics, visualizations, and maps.
Each workshop is modular and designed to stand independently as a resource online. See below for the session topics, tutorials, and materials.
An introduction to what D3 is, and what it isn't. This session will get you started, showing how to setup a document and development environment, work with selectors, create elements, and visualize a basic dataset.
This session focuses on another data visualization staple, the scatterplot, and how you can use scales and domains to account for changing datasets.
This session will showcase events in your visualization and walk through some simple interactions, including click events, transitions, and basic data sorting.
D3 supports mapping and the creation of web maps and visualizations! We will walk through the creation of a simple map in D3, add a dataset, stylize the map, and include some user events like what happens when a user clicks on a data point.
The following sites provide great examples and all of the associated code that you can grab and use for your projects. Remember to provide attribution when you 'borrow' someone elses fantastic work!
Contact Mike Foster (firstname.lastname@example.org) with questions.