Skip to content
This repository has been archived by the owner on Jun 27, 2018. It is now read-only.

Latest commit

 

History

History
189 lines (119 loc) · 5.16 KB

class-4.md

File metadata and controls

189 lines (119 loc) · 5.16 KB
Raw

Class 4

I fear the day that technology will surpass our human interaction. The world will have a generation of idiots. — Albert Einstein※

※ He never actually said this though… People love attributing quotes to Einstein.

Table of Contents

Inspiration

Keystrokes by @tmcw.

Synopsis

Schedule

Assignments

Submit your assignments by 7 a.m. the day of class 5.

See class 3 for assignments due before this class.

Assessment

Submit assessment 2 before the start of class 5.

Interactivity

Dancing in the shadow by @ardianlumi.

In this assignment you’ll learn to add interactivity to a chart.

Tips

Synopsis

Description

The project you’ll hand in will be similar to the one from Class 3: Transition but this time will render a non-basic chart with non-trivial interaction.

  1. Pick a static chart from d3’s example gallery or use one of your previously made charts from assignments or assessment 1
  2. Copy-paste the files over to your own computer and get the chart working on d3@4
  3. Add a <title> element, or replace the one already there, with your GitHub username: @username (in my case @wooorm)
  4. Move CSS and JS from the HTML into their own files: index.css and index.js
  5. Add citations to the original work in index.html and index.js
  6. Add non-trivial interactivity to your chart. Non-trivial means that the visualised data changes and uses enter, update, and exit. For example, this includes sorting and filtering and excludes zooming and tooltips
  7. Add a readme.md file similar to the one from Class 2: Do you readme?! that additionally describes what you changed and how you applied interactivity

Hand in your code in a directory username (in my case wooorm) to site/class-4-interaction/ by creating a pull request from a branch interaction. Include index.html, index.js, index.css, readme.md, optionally a preview.png file, and a data file (such as index.json, index.csv, index.tsv).

Source

File, […], arranged, and Germany @samuelzeller.

In this assignment you’ll find data for assessment 3.

Tips

Synopsis

Description

Find an interesting data source that can be used to make multiple interactive visualisations.

See assessment 3 for the requirements and make sure your data matches them.

Write a short description why you’re using this data (3 paragraphs), and how it could be used to reach assessment 3’s goals. Include links to the data and how to download it.

Hand in your description in a new issue to our repo. Use the title Assessment 3 data: @username (in my case Assessment 3 data: @wooorm).