This course covers programming in JavaScript D3 to display and visualize data as well as how to manage, transform, and normalize data for display on the screen. Students will learn how to create effective visualizations, complex drawings and animations on the web using SVG for vector graphics and Canvas for pixel based graphics.
You should take this class if you have a desire to express ideas visually on a computer screen. If you have a fascination with data and trends taking this class will give you the tools and opportunities to express these ideas in your work.
If you want to practice the craft of making web applications with HTML, CSS, and javascript this class will give you ample opportunity to stretch these skills in new directions.
Course Delivery: online | 7 weeks | 14 sessions
Course Credits: 3 units | 37.5 Seat Hours | 75 Total Hours
Students by the end of the course will be able to ...
- Analyze Data to express it's meaning
- Normalize data to express its range and value on the screen
- Implement standard and non-standard visual displays
- Use JavaScript, Canvas, and SVG to express ideas graphically
Course Dates: August 25, 2025 to October 10, 2025
Class Times: Tuesday and Thursday at 1:00 PM - 3:45 PM
Class | Date | Topics | Assignments |
---|---|---|---|
- | Week 1 | First Data Visualization | What kind of stories can you tell with data? |
1 | Tue, Aug 26 | Working with data | Titanic data challenges |
2 | Thr, May 28 | - | Titanic data challenges |
- | Week 2 | - | Turning data into images D3 Tutorials |
3 | Tue, Sep 2 | Holiday - Memorial day Learn D3 | 01 Intro to d3 - 02 Working with SVG |
4 | Thr, Sep 4 | Loading Data - Exploring Data | 03 Loading Data - 04 Scales |
- | Week 3 | Second Visualization | Using D3 |
5 | Tue, Sep 9 | Using groups | 05 Groups - 06 Challenges |
6 | Thr, Sep 11 | Pathes and Axis | 07 Paths - 08 Axis |
- | Week 4 | - | Applying D3 to your dataset |
7 | Tue, Sep 16 | Drawing bars and scatterplots | 09 Bars - 10 Scatterplots and color scales |
8 | Thr, Sep 18 | Areas and Interactions | 11 Areas - 12 Interaction |
- | Week 5 | Third visualization | - |
9 | Tue, Sep 23 | Pie Charts | 13 Pie Charts - 14 Pack |
10 | Thr, Sep 25 | Hierarchy | 15 Hierarchy - 16 D3 React |
- | Week 6 | - | - |
11 | Tue, Sep 30 | Maps | 17 D3 maps - 18 D3 maps Part 2 |
12 | Thr, Oct 2 | - | - |
- | Week 7 | - | - |
13 | Tue, Oct 7 | Final Presentation | Show your work |
14 | Thr, Oct 9 | Final Assessment | Final Data Visualization |
See the Course Requirements page for a full list of what's expected of you this term.
- COVID-19 Data:
- Our World in Data COVID-19 Dataset: Our World in Data COVID-19 Dataset
- COVID-19 Data Repository by Johns Hopkins University: COVID-19 Data Repository
- Sports Statistics:
- Kaggle Datasets: Kaggle Datasets
- ESPN API: ESPN API
- Government Open Data:
- data.gov (United States): data.gov
- data.gov.uk (United Kingdom): data.gov.uk
- Social Media Data:
- Twitter API: Twitter API
- Facebook Graph API: Facebook Graph API
- Reddit API: Reddit API
- Climate and Environmental Data:
- NASA Earth Observing System Data and Information System (EOSDIS): EOSDIS
- Climate Data Online (CDO): Climate Data Online
- World Bank Climate Change Knowledge Portal: Climate Change Knowledge Portal