Learning Processing: A Beginner's Guide to Programming Images ...

0
1
2
3
4
5
6
7
8
9
fi g. 1.9
top left (5,5)
0 1 2 3 4 5 6 7 8 9
bottom right (8,7)
rectMode (CORNERS)
rect (5,5,8,7);
bottom right y
Pixels 7
Once we have become comfortable with the concept of drawing a rectangle, an ellipse is a snap. In fact, it
is identical to rect( ) with the diff erence being that an ellipse is drawn where the bounding box 1 (as shown
in Figure 1.11 ) of the rectangle would be. Th e default mode for ellipse( ) is “ CENTER ” , rather than
“ CORNER ” as with rect( ) . See Figure 1.10 .
top left
x
top left
y
bottom right x
0 1 2 3 4 5 6 7 8 9
0 1 2 3 4 5 6 7 8 9
0
0
1
1
2
2
3
3
4 ellipseMode (CENTER); 4
5
ellipse (3,3,5,5); 5
6
6
7
7
8
8
9
9
0 1 2 3 4 5 6 7 8 9
0
1
2
3
4
5
6
7
8
9
fi g. 1.10
ellipseMode (CORNERS);
ellipse (5,5,8,7);
ellipseMode (CORNER);
ellipse (3,3,4,4);
It is important to acknowledge that in Figure 1.10 , the ellipses do not look particularly circular. Processing
has a built-in methodology for selecting which pixels should be used to create a circular shape. Zoomed
in like this, we get a bunch of squares in a circle-like pattern, but zoomed out on a computer screen,
we get a nice round ellipse. Later, we will see that Processing gives us the power to develop our own
1 A bounding box of a shape in computer graphics is the smallest rectangle that includes all the pixels of that shape. For example, the
bounding box of a circle is shown in Figure 1.11 .