Learn to design simple visualizations with D3.js and React! In this course, follow along with Shirley Wu as she goes through fundamental visualization theories and shows how to apply them to different chart types. Plus, Shirley demonstrates the best practices on how to use D3.js to generate the data for these visualizations, and how to use React to render them.
Overview
Syllabus
- Introduction
- How to Navigate the 3 Workshops
- Introduction to Different Data Types
- Pie Charts: Do's and Don't's
- Course Demonstration Review
- Introduction to SVG
- Weather Data Chart Examples
- Data to SVG Shapes Exercise
- Data to SVG Shapes Solution
- Going from Data to SVG Shapes
- Going from Data to SVG Exercise
- Going from Data to SVG Solution, Part 1
- Going from Data to SVG Solution, Part 2
- Creating Line Charts
- Creating Line Charts Exercise
- Creating Line Charts Solution
- Creating a Radial Chart
- Radial Chart Exercise
- Radial Chart Solution
- Breaking Down D3 API
- D3 Manipultations and Interactions
- React Renders
- React and Bar Chart Exercise
- React and Bar Chart Solution
- React and Radial Chart Exercise & Solution
- The Three Exceptions
- Axes, Legends, & Annotations
- Axes Exercise & Solution
- Transitions
- Brush
- Brush Exercise & Solution
- Additional Resources
- Canvas
- Creating Charts in Canvas
- Questions & Wrapping Up
Taught by
Shirley Wu
