Name: Web Development with D3.js - Gray Area
Start: 2012-11-06T18:00:00-08:00
Location: Gray Area

Web Development with D3.js

November 06 - 11 2012
Gray Area
App Closed

This workshop will introduce you to d3.js for creating data visualizations and vector graphics in the browser.

// About d3

d3.js is a JavaScript library for manipulating documents based on data. d3 helps you bring data to life using HTML, SVG and CSS. D3’s emphasis on web standards gives you the full capabilities of modern browsers without tying yourself to a proprietary framework, combining powerful visualization components and a data-driven approach to DOM manipulation.

Days 1 & 2: Turning .csv files into bar charts and scatterplots

- load a csv & use JSON
- draw rectangles
- make scales, map data to pixels
- make axes
- add labels
- complete a bar chart
- draw circles
- complete a scatter plot

Days 3 & 4: Smooth transitions and interaction

- perform basic transitions on visual properties
- trigger transition with change in data
- add some mouse interactions
- add tooltips
- link visual elements through interaction
- BONUS: touch interaction

// Course Materials:

This will be an interactive course, so you’ll need your laptop and a modern browser. We will use Python to run a simple local webserver, so it would save time to have Python installed before coming.