HTML and CSS Reference
In-Depth Information
ball.t += ball.speed;
if (ball.t > 1) {
ball.t = 1;
Finally, when we draw the ball object on the canvas, we use the xt and yt values:
Figure 5-14 shows what Example 5-11 ( CH5EX11.html ) looks like when it is executed
in a web browser. In addition to drawing the points of the path using the points array,
we also draw the four points of the Bezier curve. These illustrate the relationship of the
points to the curve itself. Notice that the curve does not pass through p1 or p2 .
Figure 5-14. Moving a circle on a Bezier curve
Example 5-11 gives the full code listing for CH5EX11.html , including the code to draw
the Bezier curve points on the canvas. You can find that code in the drawScreen() func-
tion following the //draw the points comment.
Search WWH ::

Custom Search