[whatwg] Stroking algorithm in Canvas 2d

[Justin Novosad]

On Thu, Oct 10, 2013 at 2:19 AM, Ian Hickson <ian at hixie.ch> wrote:

> On Wed, 9 Oct 2013, Rik Cabanier wrote:
> > > >
> > > > Yep, this is where assumptions went wrong. Dashes are calculated per
> > > > subpath, not per 'line'/whole path.
> > >
> > > On what basis are you asserting this?
> >
> > see this fiddle: http://jsfiddle.net/6eGxU/25/
>
> This demonstrates pretty well what is wrong with the algorithm you're
> suggesting (and which is implemented in Chrome). Why shouldn't we take
> this opportunity to fix it?
>

Wrong? That really depends on what you are trying to do.

>
> Here's an even better example of the problem:
>
>    http://goo.gl/hwK7fv


So in the case of a box, it makes perfect sense for the corners to be
start/stop points in the dashing pattern.  It gives a reassuring sense of
symmetry to the drawing.
On the other hand, if you are drawing a continuous curve in a graphing
application, you would want constant density in the dashing pattern even
though the curve way be built from a series of subpaths.

The algorithm suggested by Rik allows for both, but is not ideal.
Basically: dashing is continuous over joins. If you want to insert a break
point in the dashing pattern, you just end the current path and start a new
one, or break continuity by calling moveTo like you (Ian) did in the fiddle
cited above.

The main issue I see with that algorithm is that it does not solve the case
where you would want a join and a dashing break at the same point. I think
that is an important case to support, in particular for drawing rectangles.

One way we could address this by adding a new path method that inserts a
break in the dashing pattern (without unjoining the subpaths).
Also, I think it should be implicit in the rect() path primitive that the
corners are joined and that they are also stop/start points for the dashing
pattern.

   -Justin