# [whatwg] Dashed strokes on <canvas>

Philip Taylor excors+whatwg at gmail.com
Thu May 17 09:46:49 PDT 2007

```On 16/05/07, Ian Hickson <ian at hixie.ch> wrote:
> On Thu, 10 May 2007, Philip Taylor wrote:
> >
> > e.g. the curve drawing section should give the equation for computing
> > the points on the curve
>
> For arc() and arcTo() the definition seems complete, but I'm not familiar
> enough with graphics theory to know what quadraticCurveTo() and
> bezierCurveTo() need. Could you suggest some text?

I'd probably just add the equations of the curves kind of like:

"""
The quadraticCurveTo(cpx, cpy, x, y) method must do nothing if the
context has no subpaths. Otherwise it must connect the last point in
the subpath to the given point (x, y) by a quadratic curve with
control point (cpx, cpy), and must then add the given point (x, y) to
the subpath. The curve must cover the points \$C(t) = (1-t)^2 P_0 + 2 t
(1-t) P_1 + t^2 P_2\$ with t ranging from 0 to 1, where P_0 is the last
point in the subpath, P_1 is the control point (cpx, cpy), and P_2 is
the point (x, y).

The bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y) method must do nothing
if the context has no subpaths. Otherwise, it must connect the last
point in the subpath to the given point (x, y) using a Bézier curve
with control points (cp1x, cp1y) and (cp2x, cp2y). Then, it must add
the point (x, y) to the subpath. The curve must cover the points \$C(t)
= (1-t)^3 P_0 + 3 t (1-t)^2 P_1 + 3 t^2 (1-t) P_2 + t^3 P_3\$ with t
ranging from 0 to 1, where P_0 is the last point in the subpath, P_1
is the control point (cp1x, cp1y), P_2 is the control point (cp2x,
cp2y), and P_3 is the point (x, y).
"""
(Also s/bezier/Bézier/)

The old ExplorerCanvas and (apparently) Firefox 1.5 got quadratic
curves wrong, so it seems good to be explicit about what they are.
http://canvex.lazyilluminati.com/misc/curve.html demonstrates curves
being drawn as a series of straight lines using the above equations,
which appears to work correctly.

--
Philip Taylor
excors at gmail.com

```