68
The following methods allow authors to manipulate thepathsp603
of objects implementing theCanvasPathp590
interface.
For objects implementing theCanvasDrawPathp588
andCanvasTransformp587
interfaces, the points passed to the methods, and the resulting
lines added tocurrent default pathp617
by these methods, must be transformed according to thecurrent transformation matrixp608
before being added
to the path.
ThemoveTo(x, y)method must create a new subpath with the specified point as its first (and only) point.
When the user agent is toensure there is a subpathfor a coordinate (x,y) on apathp603
, the user agent must check to see if thepathp603
has its
need new subpathp603
flag set. If it does, the user agent must create a new subpath with the point (x,y) as its first (and only) point, as if the
moveTo()p606
method had been called, and must then unset thepathp603
'sneed new subpathp603
flag.
TheclosePath()method must do nothing if the object's path has no subpaths. Otherwise, it must mark the last subpath as closed, create a new
subpath whose first point is the same as the previous subpath's first point, and finally add this new subpath to the path.
New points and the lines connecting them are added to subpaths using the methods described below. In all cases, the methods only modify the last
subpath in the object's path.
ThelineTo(x, y)method mustensure there is a subpathp606
for(x,y)if the object's path has no subpaths. Otherwise, it must connect the last
point in the subpath to the given point (x,y) using a straight line, and must then add the given point (x,y) to the subpath.
ThequadraticCurveTo(cpx, cpy, x, y)method mustensure there is a subpathp606
for(cpx,cpy), and then must connect the last point in
the subpath to the given point (x,y) using a quadratic Bézier curve with control point (cpx,cpy), and must then add the given point (x,y) to the
subpath.[BEZIER]p1158
ThebezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y)method mustensure there is a subpathp606
for(cp1x,cp1y), and then must connect
the last point in the subpath to the given point (x,y) using a cubic Bézier curve with control points (cp1x,cp1y) and (cp2x,cp2y). Then, it must add
the point (x,y) to the subpath.[BEZIER]p1158
ThearcTo(x1, y1, , x2, , y2, radiusX, radiusY, rotation)method must firstensure there is a subpathp606
for(x1,y1). Then, the
behaviour depends on the arguments and the last point in the subpath, as described below.
Negative values forradiusXorradiusYmust cause the implementation to throw an"IndexSizeError"
DOMException
. IfradiusYis omitted, user
agents must act as if it had the same value asradiusX.
Let the point (x0,y0) be the last point in the subpath, transformed by the inverse of thecurrent transformation matrixp608
(so that it is in the same
coordinate system as the points passed to the method).
If the point (x0,y0) is equal to the point (x1,y1), or if the point (x1,y1) is equal to the point (x2,y2), or if bothradiusXandradiusYare zero, then the
method must add the point (x1,y1) to the subpath, and connect that point to the previous point (x0,y0) by a straight line.
Otherwise, if the points (x0,y0), (x1,y1), and (x2,y2) all lie on a single straight line, then the method must add the point (x1,y1) to the subpath, and
connect that point to the previous point (x0,y0) by a straight line.
Otherwise, letThe Arcbe the shortest arc given by circumference of the ellipse that has radiusradiusXon the major axis and radiusradiusYon the
minor axis, and whose semi-major axis is rotatedrotationradians clockwise from the positive x-axis, and that has one point tangent to the half-
infinite line that crosses the point (x0,y0) and ends at the point (x1,y1), and that has a different point tangent to the half-infinite line that ends at the
point (x1,y1) and crosses the point (x2,y2). The points at which this ellipse touches these two lines are called the start and end tangent points
respectively. The method must connect the point (x0,y0) to the start tangent point by a straight line, adding the start tangent point to the subpath,
and then must connect the start tangent point to the end tangent point byThe Arc, adding the end tangent point to the subpath.
Thearc(x, y, radius, startAngle, endAngle, anticlockwise)andellipse(x, y, radiusX, , radiusY, , rotation,
startAngle, endAngle, anticlockwise)methods draw arcs.
Thearc()p606
method is equivalent to theellipse()p606
method in the case where the two radii are equal. When thearc()p606
method is
invoked, it must act as if theellipse()p606
method had been invoked with theradiusXandradiusYarguments set to the value of theradius
If the last subpath had more than one point in its list of points, then this is equivalent to adding a straight line connecting the last point back
to the first point, thus "closing" the shape, and then repeating the last (possibly implied)moveTo()p606
call.
Note
606