Week 2

Bitmaps, vectors and dynamic imagery

Your class web folder (and URL)

Creating image-like things
Manipulating images

<canvas>  from HTML5 -- a simple example

A D3 example from Jake Weidman

vectors vs bitmaps -- please read!

Bezier curves (quadratic and cubic)

Assignment #2 -- Due Friday, September 15.
a) Make a web page (html) containing a 600 px by 600 px <canvas>. Use canvas commands to draw a house with pitched roof, a door and two windows. Color the roof and the walls of the house with different colors.
b) Make another page with a canvas element and a collection of four radio buttons (with values first. second, third and fourth). As the mouse moves over the canvas make it so that the nth (for n = {first,second,third, fourth}) control point of a cubic Bezier curve is positioned at the current position of the mouse.