Skip to content

Commit

Permalink
Fix the definition of pixelated for createImageBitmap
Browse files Browse the repository at this point in the history
This adopts the CSS definition from https://drafts.csswg.org/css-images-3/#valdef-image-rendering-pixelated, adapted for the HTML context.

Closes whatwg#3485.
  • Loading branch information
schenney-chromium authored Aug 5, 2024
1 parent 0068b12 commit 8c74909
Showing 1 changed file with 11 additions and 4 deletions.
15 changes: 11 additions & 4 deletions source
Original file line number Diff line number Diff line change
Expand Up @@ -115930,9 +115930,15 @@ dictionary <dfn dictionary>ImageBitmapOptions</dfn> {
interpolation quality to use when scaling images.</p>

<p>The "<dfn enum-value for="ResizeQuality"><code
data-x="dom-ResizeQuality-pixelated">pixelated</code></dfn>" value indicates a preference to scale
the image that maximizes the appearance. Scaling algorithms that "smooth" colors are acceptable,
such as bilinear interpolation.</p>
data-x="dom-ResizeQuality-pixelated">pixelated</code></dfn>" value indicates a preference for
scaling the image to preserve the pixelation of the original as much as possible, with minor
smoothing as necessary to avoid distorting the image when the target size is not a clean multiple
of the original.</p>

<p>To implement "<code data-x="dom-ResizeQuality-pixelated">pixelated</code>", for each axis
independently, first determine the integer multiple of its natural size that puts it closest to
the target size and is greater than zero. Scale it to this integer-multiple-size using nearest
neighbor, then scale it the rest of the way to the target size using bilinear interpolation.</p>

<p>The "<dfn enum-value for="ResizeQuality"><code data-x="dom-ResizeQuality-low">low</code></dfn>"
value indicates a preference for a low level of image interpolation quality. Low-quality image
Expand All @@ -115950,7 +115956,8 @@ dictionary <dfn dictionary>ImageBitmapOptions</dfn> {
<p class="note">Bilinear scaling is an example of a relatively fast, lower-quality image-smoothing
algorithm. Bicubic or Lanczos scaling are examples of image-scaling algorithms that produce
higher-quality output. This specification does not mandate that specific interpolation algorithms
be used unless the value is "<span data-x="dom-ResizeQuality-pixelated">pixelated</span>".</p>
be used, except for "<code data-x="dom-ResizeQuality-pixelated">pixelated</code>" as described
above.</p>

</div>

Expand Down

0 comments on commit 8c74909

Please sign in to comment.