HTML5 Guidelines for Web Developers

(coco) #1
5.5 Paths 119

5.5.1 Lines


To create lines as in our example of the letter A, Canvas offers the method
lineTo():


context.lineTo(x, y)


The effect of the method is shown in Figure 5.7.


Figure 5.7 The path method “lineTo()”


Expressed in words, this means line to point x/y, which means we have to already
have defined a starting point with moveTo() or still have an end point from the
previous drawing step. After drawing the line, the coordinate x/y becomes the
new current point.


In all graphics used to demonstrate the path drawing methods, we have marked
the starting point x0/y0 in light gray and the new current point in bold type.

NOTE
Free download pdf