[whatwg] Blurry lines in 2D Canvas

[Ian Hickson]

On Thu, 5 Sep 2013, Rik Cabanier wrote:
> On Thu, Sep 5, 2013 at 3:22 PM, Ian Hickson <ian at hixie.ch> wrote:
> > On Sat, 10 Aug 2013, Rik Cabanier wrote:
> > >
> > > I was wondering if this is something that happens in Flash as well. 
> > > It turns out that there's an option called "hinting: Keep stroke 
> > > anchors on full pixels to prevent blurry lines." There's a blog post 
> > > on what this does:
> > >
> > > http://www.kaourantin.net/2005/08/stroke-hinting-in-flash-player-8-aka.html
> > > http://www.kaourantin.net/2005/08/stroke-hinting-in-flash-player-8-aka.html
> > >
> > > I created an example (in flash sorry) that shows the feature: 
> > > http://cabanier.github.io/BlendExamples/pixelsnap/pixelsnap.html 2 
> > > sets of strokes move across the screen and are also scaled.
> > >
> > > The top strokes behave like canvas does today. They start of blurry 
> > > and during the animation they slowly get ticker. For some reason it 
> > > doesn't look very smooth. The bottom strokes have hinting turned on. 
> > > They are sharp at the beginning and during the animation they stay 
> > > the same size until the internal stroke width is large enough. At 
> > > that point you see a 'jump'.
> > >
> > > I think canvas should have a similar feature...
> >
> > Can you elaborate on how exactly you would want this to work? How 
> > would you avoid the alignment and distortion problems when applying 
> > this to anything less trivial than a rectangle?
> 
> Basically, this would *just* move the control points and the width of 
> paths so the strokes are always aligned to the pixel grid (This would 
> take pixel density and transformations into account). After this, you 
> would draw as usual.

Can you define "aligned to the pixel grid"?

If I have a line from x1,y to x2,y, followed by an arc from x2,y back to 
x1,y with radius r, what should happen and why?

What if they're draw as separate paths?

-- 
Ian Hickson               U+1047E                )\._.,--....,'``.    fL
http://ln.hixie.ch/       U+263A                /,   _.. \   _\  ;`._ ,.
Things that are impossible just take longer.   `._.-(,_..'--(,_..'`-.;.'