Skip to content

Slides for the W209 Information Visualization course of the Masters in Data Science at UC Berkeley

License

Notifications You must be signed in to change notification settings

john-guerra/MIDS_W209_Information_Visualization_Slides

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

MIDS W209 Information Visualization Slides

Slides source code for the W209 Information Visualization course of the Masters in Data Science at UC Berkeley. Designed by John Alexis Guerra Gomez and Andy Reagan.

Apart from the slides included in this code, you can also find below links to the videos and Observable notebooks used for each module

Video Playlists

Week 01: Introduction

Slides

Software Demos

Unit Number Element Name Presenter Youtube Link Content Link
1 Web Development for Visualization John link
1 Introduction to Observable John link
1 Introduction to D3 John link
1 Introduction to Vega-Lite John link
1 Introduction to Python and Altair Andy link slides
1 Introduction to Tableau John link

Week 02: What

Slides

Software Demos

Unit Number Element Name Presenter Youtube Link Content Link
2 Introduction to JavaScript John link
2 Introduction to JavaScript John link observable
2 Introduction to JavaScript John link observable
2 Introduction to JavaScript John link observable
2 Nesting, Folding, Pivoting, etc. John link
2 Reshaping & Pivot Tables with Pandas Andy link
2 Data manipulation in Tableau John link
2 Introduction to Flask: Web basics Andy link
2 Introduction to Flask Andy link

Week 03: Why

Slides

Software Demos

Unit Number Element Name Presenter Youtube Link Content Link
3 Scalable Vector Graphics (SVG) John link
3 Canvas John link
3 WebGL John link
3 Setting up d3 John link observable
3 Setting up altair Andy link collab
3 Setting up vega-lite John link observable
3 Setting up Tableau John link observable

All of the collaboratory files are here.

Week 04: How

Slides

Software Demos

Unit Number Element Name Presenter Youtube Link Content Link
4 Introduction to D3 Selections John link observable
4 Marks & Channels in d3 John link observable
4 Marks & Channels in vega-lite John link observable
4 Marks and Channels in Altair Andy link collab
4 Marks and Channels in Tableau John link

Week 05: Rules_of_thumb

Slides

Software Demos

Unit Number Element Name Presenter Youtube Link Content Link
5 D3: Axis, Data Binding John link observable
5 D3: Modularization John link
5 D3 Extra: Deploying to NPM Andy link
5 Vega-Lite-API: Axis, Headers, Config John link
5 Altair: Axis, Headers, Config Andy link collab
5 Tableau: Calculated Fields, LOD Functions John link

Week 06: Tabular

Slides

Software Demos

Unit Number Element Name Presenter Youtube Link Content Link
6 D3 Path John link observable
6 D3 Other Scales John link
6 D3 Creating a Histogram John link
6 D3 Stack and Other Layouts John link
6 D3 Circular and Spiral John link
6 Vega-Lite-API Path John link
6 Altair API Andy link collab
6 Tableau Histrograms, Stacked, and Radial John link

Week 07: Time

Slides

Software Demos

Unit Number Element Name Presenter Youtube Link Content Link
7 Time with d3 John link
7 Time with d3 2 John link observable
7 Time with vega-lite John link observable
7 Altair Temporal Pt 1 Andy link collab
7 Altair Temporal Pt 2 Andy link same ^
7 Time with tableau John link

Week 08: Networks_and_Color

Slides

Software Demos

Unit Number Element Name Presenter Youtube Link Content Link
8 Networks with d3 John link observable
8 Networks with vega-lite John link observable
8 Networks with altair Andy link collab
8 Networks with tableau John link observable
8 Color with d3 John link
8 Color with vega-lite John link
8 Color with altair Andy link
8 Color with tableau John link

Week 09: Trees_and_Geo

Slides

Software Demos

Unit Number Element Name Presenter Youtube Link Content Link
9 Trees with d3 John link observable
9 Trees with vega-lite John link observable
9 Trees with altair Andy link collab
9 Trees with tableau John link
9 Geo with d3 John link
9 Geo with vega-lite John link observable
9 Geo with altair Pt 1 Andy link collab
9 Geo with altair Pt 2 Andy link collab
9 Geo with tableau and mapbox John link

Week 10: Manipulate_Views

Slides

Software Demos

Unit Number Element Name Presenter Youtube Link Content Link
10 Animations on the Web With D3 Transitions: Tweening and Flubber John link observable
10 Vega-Lite Animations John link
10 Animations With Tableau Andy link Based on this recreation of Gapminder

Week 11: Faceting

Slides

Software Demos

Unit Number Element Name Presenter Youtube Link Content Link
11 How to Scroll John link
11 D3 Faceting John link
11 Vega-Lite Faceting John link
11 Faceting with altair 1 Andy link collab
11 Faceting with altair 2: Dashboard inside Collab Andy link
11 Faceting with altair 3: Build a dashboard Andy link
11 Faceting with tableau John link

Week 12: Evaluation

Slides

Week 13: Reducing

Slides

Software Demos

Unit Number Element Name Presenter Youtube Link Content Link
13 Crossfilter John link observable
13 Filtering Items and Attributes in Javascript John link
13 Tableau Data Preparation John link

Week 14: Advanced

Slides

Software Demos

Unit Number Element Name Presenter Youtube Link Content Link
14 Visualization for Machine Learning Andy link
14 Deploy AWS EC2 Server using AWS Console Andy link
14 Deploy AWS EC2 Server using Terraform Andy link
14 Python Flask on AWS EC2 Andy link
14 Full-stack with Nginx, UWSGI, Flask Andy link

Vis for ML links:

Notes

How to embed a youtube video with the screenshot in markdown:

epsBLcPaSNk

How to embed slides with HTML, can control the width more easily:

How to embed slides with markdown:

slides

About

Slides for the W209 Information Visualization course of the Masters in Data Science at UC Berkeley

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published