HTML and CSS Reference
In-Depth Information
Drawing with Paths
The list below is a refresher on drawing with paths:
1. Always start a new path with the
context.beginPath()
function call.
2. Set
context.strokeStyle()
before starting to draw the path.
3. Use a combination of the
context.moveTo()
and
context.drawTo()
stroke com-
mands to paint the path lines.
4. End the drawing with the
context.stroke()
call, and close off the path with
context.closePath()
.
We are drawing to the upper-left corner of the screen starting at
0
,
0
.
Figure 8-3
shows
what this will look like.
Figure 8-3. The player ship on the canvas
The ship with thrust engaged (frame 2)
Now let's take a look at the second frame of animation for the player ship, which is
shown in
Figure 8-4
.
Figure 8-4. The player ship with thrust engaged