[whatwg] Blurry lines in 2D Canvas (and SVG)

David Dailey ddailey at zoominternet.net
Tue Jul 23 17:18:35 PDT 2013


Hi Rik,

Just affirming what you've said in SVG:
http://cs.sru.edu/~ddailey/svg/edgeblurs.svg

The middle rects are crisp, having been merely translated leftward and
downward by half a pixel. Zooming in from the browser rectifies the problem
(as expected) after a single tick.

I remember folks discussing sub-pixel antialiasing quite a bit on the SVG
lists circa fall/winter 2011. It seemed to cause some troubles for D3. Is
that the same issue?

Cheers
David


-----Original Message-----
From: whatwg-bounces at lists.whatwg.org
[mailto:whatwg-bounces at lists.whatwg.org] On Behalf Of Rik Cabanier
Sent: Tuesday, July 23, 2013 7:19 PM
To: whatwg at whatwg.org
Subject: [whatwg] Blurry lines in 2D Canvas (and SVG)

All,

we've noticed that if you draw lines in canvas or SVG, they always end up
blurry.
For instance see this fiddle: http://jsfiddle.net/V92Gn/128/

This happens because you offset 1 pixel and then draw a half pixel stroke on
each side. Since it covers only half the pixel, the color gets mapped to 50%
gray.
You can work around this by doing an extra offset of half the
devicepixelratio, but ideally this should never happen.

Is this behavior specified somewhere?
Is there a way to turn this off?





More information about the whatwg mailing list