Autoplay
Autocomplete
Previous Lesson
Complete and Continue
Building Responsive Data Visualizations with D3.js
Building Blocks 1 – Noninteractive, Reusable Charts
Course Overview (4:15)
Creating a Bar Chart with SVGs (4:03)
Creating a D3 Bar Chart (6:13)
Creating a D3 Line Chart (3:30)
Creating a D3 Scatterplot (3:13)
Building Blocks 2 – Adding Scales, Axes, and Labels
Adding Simple Labels (2:37)
Creating Tooltips for Your Visualization (3:31)
Utilizing D3 Scales (5:33)
Adding Axes (5:28)
Responsive Visual Strategies
Defining Responsive and Mobile-first Design (5:30)
Using Media Queries and Addressing Breakpoints (8:26)
Choosing a Visualization Style Based on the Media Type (3:41)
Matching the Chart Size with the Container Size (4:42)
Scaling All Visualization Elements Based on Container Size (3:32)
Building Blocks 3 – External Data Sources
Integrating CSV Data (8:09)
Getting Data from JSON (3:02)
Building a Map with GeoJSON (6:38)
Building Blocks 4 – Interactivity
Using Transitions (4:37)
Filtering Data (4:06)
D3 Layouts (8:32)
Mapping with GeoJSON
Setting Up the Basemap (5:11)
Choropleths (1:33)
Adding Tooltips and Legends to Our Map (3:37)
Making It Mobile-first
Drawing Maps According to Screen Size (4:49)
Throwing in Bootstrap (4:59)
Integrating Pym into Your Visualization (3:17)
Moving Forward
Recapping What We’ve Covered (2:18)
What to Read and Whom to Follow (1:12)
Setting Up the Basemap
Complete and Continue