HTML and CSS Reference
Your bricks are ready to go; now let's work on the ball.
6.2.3. Creating arcs and circles
You'll create the ball using arc(x, y, radius, startAngle, endAngle) , as
illustrated in figure 6.7 , which is what you use to create circular shapes. Unlike the rect-
angles you drew, which started from the top left, arc() 's starting point is in the center.
You'll give the arc() a radius in pixels, then a startAngle and endAngle , which
creates the circle. StartAngle is usually 0pi, whereas the endAngle is 2pi because it's
the circumference of a circle (using only 1pi will create half a circle).
Figure 6.7. An arc with these parameters creates a shape at 7, 22 (x, y) on a graph. Because the angle starts from 0
and goes to 2pi, it creates a full circle. If you were to make the end angle 1pi, it would produce half a circle.