1. gureckislab

  2. collecting behavioral data online

  3. Lecture 5

Lecture 5:

Drawing things to the browser window, manipulating DOM

Lecture 5 Slide Deck


This week (and partly next week) we are going to do an in-class exercise on programming in the browser, manipulating the DOM, and adding buttons which accept user interaction.

Video 5.1

Drawing and animating in the browser.

Assignments

In class, and in the video, we step through these goals:
  1. Draw a stimulus on the screen (e.g., a circle)
  2. Add a button to advance to the next trial
  3. Display a sequence of trials
Please try to follow along with these steps to make your own basic experiment.
This is a direct link to the file I created in the video (custom.js)

Assigned Readings

Scott Murray's Fundamentals of d3.js
Scott Murray's Setup of d3.js
Scott Murray's Adding element with d3.js
Scott Murray's Chaining methods d3.js