[whatwg] Canvas: even-odd winding rule fills

James Ascroft-Leigh jwal at jwal.me.uk
Wed Jan 2 03:40:34 PST 2013


I recently discovered that a common and well understood 2D graphics
operation is not supported by the 2D canvas API even though it is supported
by almost every other modern 2D graphics API.  This missing feature is
called even-odd fill and controls how the fill region is calculated for
self-intersecting paths or enclosed subpaths.

This is already implemented in Mozilla Firefox as the mozFillRule property
of the 2D canvas drawing context which can take the values "nonzero"
(default) and "evenodd".  The feature is used by projects such as pdf.js
for rendering PDFs to the canvas.

I am working on adding similar functionality to WebKit (for Apple Safari,
Google Chrome and other related browsers).  This is actually really easy as
the backend drawing APIs already have the necessary features to support SVG

The suggestion has been made that this is added as an unprefixed fillRule
property and incorporated into the HTML standard.  This has been mentioned
on this list before but there hasn't really been much discussion. Please
see the links below for more information if you are interested.

   * Webkit patch: https://bugs.webkit.org/show_bug.cgi?id=105508
   * W3 "bug": https://www.w3.org/Bugs/Public/show_bug.cgi?id=19932
   * pdf.js issue: https://github.com/mozilla/pdf.js/issues/2351

Post to the list if you have any comments about the proposal or if you
think you can help me.



More information about the whatwg mailing list