Short URL: http://html5.org/r/7178
| SVN | Bug | Comment | Time (UTC) |
|---|---|---|---|
| 7178 | 2012-07-17 07:45 |
Index: source
===================================================================
--- source (revision 7177)
+++ source (revision 7178)
@@ -55,6 +55,8 @@
this would cause. We'll probably be able to fix them some day,
but for now we are living with them. -->
+<!--SET FINGERPRINT=<a href="#fingerprint" class="fingerprint"><img src="images/fingerprint.png" alt="(This is a fingerprinting vector.)"></a>-->
+
<!--START w3c-html-->
<h2 id="introduction">Introduction</h2>
<!--END w3c-html-->
@@ -3148,6 +3150,7 @@
href="#refsCSSOMVIEW">[CSSOMVIEW]</a>
<ul class="brief">
+ <li><dfn><code>Screen</code></dfn></li>
<li><dfn><code>LinkStyle</code></dfn></li>
<li><dfn><code>CSSStyleDeclaration</code></dfn></li>
<li><dfn><code>StyleSheet</code></dfn></li>
@@ -41125,7 +41128,9 @@
attribute unsigned long <span title="dom-canvas-height">height</span>;
DOMString <span title="dom-canvas-toDataURL">toDataURL</span>(optional DOMString type, any... args);
+ DOMString <span title="dom-canvas-toDataURLHD">toDataURLHD</span>(optional DOMString type, any... args);
void <span title="dom-canvas-toBlob">toBlob</span>(<span>FileCallback</span>? _callback, optional DOMString type, any... args);
+ void <span title="dom-canvas-toBlobHD">toBlobHD</span>(<span>FileCallback</span>? _callback, optional DOMString type, any... args);
object? <span title="dom-canvas-getContext">getContext</span>(DOMString contextId, any... args);
};</pre>
@@ -41403,6 +41408,7 @@
<dl class="domintro">
<dt><var title="">url</var> = <var title="">canvas</var> . <code title="dom-canvas-toDataURL">toDataURL</code>( [ <var title="">type</var>, ... ] )</dt>
+ <dt><var title="">url</var> = <var title="">canvas</var> . <code title="dom-canvas-toDataURLHD">toDataURLHD</code>( [ <var title="">type</var>, ... ] )</dt>
<dd>
@@ -41427,9 +41433,15 @@
which case the result might simply be "<code
title="">data:,</code>".)</p>
+ <p>The <code title="dom-canvas-toDataURL">toDataURL()</code>
+ method returns the data at a resolution of 96dpi. The <code
+ title="dom-canvas-toDataURLHD">toDataURLHD()</code> method returns
+ it at the native canvas bitmap resolution.</p>
+
</dd>
<dt><var title="">canvas</var> . <code title="dom-canvas-toBlob">toBlob</code>(<var title="">callback</var> [, <var title="">type</var>, ... ])</dt>
+ <dt><var title="">canvas</var> . <code title="dom-canvas-toBlobHD">toBlobHD</code>(<var title="">callback</var> [, <var title="">type</var>, ... ])</dt>
<dd>
@@ -41444,6 +41456,11 @@
type, and control the way that the image is generated, as given in
the table below.</p>
+ <p>The <code title="dom-canvas-toBlob">toBlob()</code> method
+ provides the data at a resolution of 96dpi. The <code
+ title="dom-canvas-toBlobHD">toBlobHD()</code> method provides it
+ at the native canvas bitmap resolution.</p>
+
</dd>
</dl>
@@ -41451,8 +41468,9 @@
<div class="impl">
<p>The <dfn
- title="dom-canvas-toDataURL"><code>toDataURL()</code></dfn> method
- must run the following steps:</p>
+ title="dom-canvas-toDataURL"><code>toDataURL()</code></dfn> and <dfn
+ title="dom-canvas-toDataURLHD"><code>toDataURLHD()</code></dfn>
+ methods must run the following steps:</p>
<ol>
@@ -41471,7 +41489,10 @@
<li><p>Let <var title="">file</var> be <span>a serialization of the
image as a file</span>, using the method's arguments (if any) as
- the <var title="">arguments</var>.</p></li>
+ the <var title="">arguments</var>, and with the <var
+ title="">native</var> flag set if the method is the <code
+ title="dom-canvas-toDataURLHD">toDataURLHD()</code> method, and not
+ otherwise.</p></li>
<li><p>Return a <span title="data protocol"><code
title="">data:</code> URL</span> representing <var
@@ -41483,9 +41504,9 @@
</ol>
- <p>The <dfn
- title="dom-canvas-toBlob"><code>toBlob()</code></dfn> method
- must run the following steps:</p>
+ <p>The <dfn title="dom-canvas-toBlob"><code>toBlob()</code></dfn>
+ and <dfn title="dom-canvas-toBlobHD"><code>toBlobHD()</code></dfn>
+ methods must run the following steps:</p>
<ol>
@@ -41509,8 +41530,10 @@
<p>Otherwise, let <var title="">result</var> be a
<code>Blob</code> object representing <span>a serialization of the
- image as a file</span>, using <var title="">arguments</var>. <a
- href="#refsFILEAPI">[FILEAPI]</a> </p>
+ image as a file</span>, using <var title="">arguments</var>, and
+ with the <var title="">native</var> flag set if the method is the
+ <code title="dom-canvas-toBlobHD">toBlobHD()</code> method, and
+ not otherwise. <a href="#refsFILEAPI">[FILEAPI]</a> </p>
</li>
@@ -41531,22 +41554,38 @@
<p>When a user agent is to create <dfn>a serialization of the image
as a file</dfn>, optionally with some given <var
- title="">arguments</var>, it must create an image file in the format
- given by the first value of <var title="">arguments</var>, or, if
- there are no <var title="">arguments</var>, in the PNG format. <a
- href="#refsPNG">[PNG]</a></p>
+ title="">arguments</var>, and optionally with a <var
+ title="">native</var> flag set, it must create an image file in the
+ format given by the first value of <var title="">arguments</var>,
+ or, if there are no <var title="">arguments</var>, in the PNG
+ format. <a href="#refsPNG">[PNG]</a></p>
+ <p>If the <var title="">native</var> flag is set, or if the canvas
+ bitmap has one pixel per coordinate space unit, then the image file
+ must have the same pixel data (before compression, if applicable) as
+ the canvas bitmap, and if the file format used supports encoding
+ resolution metadata, the resolution of the bitmap (device pixels per
+ coordinate space units being interpreted as image pixels per CSS
+ pixel) must be given as well.</p>
+
+ <p>Otherwise, the image file's pixel data must be the canvas
+ bitmap's pixel data scaled to one image pixel per coordinate space
+ unitl, and if the file format used supports encoding resolution
+ metadata, the resolution must be given as 96dpi (one image pixel per
+ CSS pixel).</p>
+
<p>If <var title="">arguments</var> is not empty, the first value
must be interpreted as a <span title="MIME type">MIME type</span>
giving the format to use. If the type has any parameters, it must be
treated as not supported.</p>
- <p class="example">For example, the value "<code>image/png</code>" would
- mean to generate a PNG image, the value "<code>image/jpeg</code>"
- would mean to generate a JPEG image, and the value
- "<code>image/svg+xml</code>" would mean to generate an SVG image
- (which would probably require that the implementation actually keep
- enough information to reliably render an SVG image from the canvas).</p>
+ <p class="example">For example, the value "<code>image/png</code>"
+ would mean to generate a PNG image, the value
+ "<code>image/jpeg</code>" would mean to generate a JPEG image, and
+ the value "<code>image/svg+xml</code>" would mean to generate an SVG
+ image (which would probably require that the implementation actually
+ keep enough information to reliably render an SVG image from the
+ canvas).</p>
<p>User agents must support PNG ("<code>image/png</code>"). User
agents may support other types. If the user agent does not support
@@ -41732,9 +41771,11 @@
// pixel manipulation
<span>ImageData</span> <span title="dom-context-2d-createImageData">createImageData</span>(double sw, double sh);
<span>ImageData</span> <span title="dom-context-2d-createImageData">createImageData</span>(<span>ImageData</span> imagedata);
+ <span>ImageData</span> <span title="dom-context-2d-createImageDataHD">createImageDataHD</span>(double sw, double sh);
<span>ImageData</span> <span title="dom-context-2d-getImageData">getImageData</span>(double sx, double sy, double sw, double sh);
+ <span>ImageData</span> <span title="dom-context-2d-getImageDataHD">getImageDataHD</span>(double sx, double sy, double sw, double sh);
void <span title="dom-context-2d-putImageData">putImageData</span>(<span>ImageData</span> imagedata, double dx, double dy);
- void <span title="dom-context-2d-putImageData">putImageData</span>(<span>ImageData</span> imagedata, double dx, double dy, double dirtyX, double dirtyY, double dirtyWidth, double dirtyHeight);
+ void <span title="dom-context-2d-putImageDataHD">putImageDataHD</span>(<span>ImageData</span> imagedata, double dx, double dy, double dirtyX, double dirtyY, double dirtyWidth, double dirtyHeight);
};
<span>CanvasRenderingContext2D</span> implements <span>CanvasDrawingStyles</span>;
<span>CanvasRenderingContext2D</span> implements <span>CanvasPathMethods</span>;
@@ -41912,7 +41953,56 @@
</div>
+ <h6>Resolution</h6>
+ <p>The user agent may use a bitmap of any square resolution as the
+ backing store for a canvas that uses the 2D context. Once a canvas
+ has a bitmap, that canvas must keep its resolution for its
+ lifetime.</p>
+
+ <p class="note">In general, user agents are encouraged to use a
+ resolution equal to the screen resolution. Ideally, the number of
+ device pixels per CSS pixel would be a multiple of two. Several
+ factors can affect the screen resolution: most prominently the
+ actual display resolution, but also important is the current zoom
+ level.</p>
+
+ <p>All the bitmaps created during a single <span
+ title="concept-task">task</span> for canvases that use 2D contexts
+ must have the same resolution.
+ <!--XXX 4INSERT FINGERPRINT-->
+ </p>
+
+ <pre class="idl">partial interface <span>Screen</span> {
+ readonly attribute double <span title="dom-screen-canvasResolution">canvasResolution</span>;
+};</pre>
+
+ <dl class="domintro">
+
+ <dt><var title="">window</var> . <code title="dom-Window-screen">screen</code> . <code title="dom-screen-canvasResolution">canvasResolution</code></dt>
+
+ <dd>
+
+ <p>Returns the resolution that has been, or will be, used for bitmaps during this <span title="concept-task">task</span>.</p>
+
+ </dd>
+
+ </dl>
+
+ <div class="impl">
+
+ <p>The <dfn
+ title="dom-screen-canvasResolution"><code>canvasResolution</code></dfn>
+ attribute of the <code>Screen</code> object must return the
+ resolution, in image pixels per coordinate space units, that any
+ canvas bitmaps created during this <span
+ title="concept-task">task</span> will use (or have used). <a
+ href="#refsCSSOMVIEW">[CSSOMVIEW]</a></p>
+
+ </div>
+
+
+
<h6>The canvas state</h6>
<p>Each context maintains a stack of drawing states. <dfn
@@ -46686,6 +46776,18 @@
</dd>
+ <dt><var title="">imagedata</var> = <var title="">context</var> . <code title="dom-context-2d-createImageDataHD">createImageDataHD</code>(<var title="">sw</var>, <var title="">sh</var>)</dt>
+
+ <dd>
+
+ <p>Returns an <code>ImageData</code> object whose dimensions equal
+ the dimensions given in the arguments, multiplied by the number of
+ pixels in the canvas bitmap that correspond to each coordinate
+ space unit. All the pixels in the returned object are transparent
+ black.</p>
+
+ </dd>
+
<dt><var title="">imagedata</var> = <var title="">context</var> . <code title="dom-context-2d-getImageData">getImageData</code>(<var title="">sx</var>, <var title="">sy</var>, <var title="">sw</var>, <var title="">sh</var>)</dt>
<dd>
@@ -46703,12 +46805,34 @@
</dd>
+ <dt><var title="">imagedata</var> = <var title="">context</var> . <code title="dom-context-2d-getImageDataHD">getImageDataHD</code>(<var title="">sx</var>, <var title="">sy</var>, <var title="">sw</var>, <var title="">sh</var>)</dt>
+
+ <dd>
+
+ <p>Returns an <code>ImageData</code> object containing the image
+ data for the given rectangle of the canvas.</p>
+
+ <p>Throws a <code>NotSupportedError</code> exception if any of the
+ arguments are not finite. Throws an <code>IndexSizeError</code>
+ exception if the either of the width or height arguments are
+ zero.</p>
+
+ <p>The data will be returned at the same resolution as the canvas
+ bitmap.</p>
+
+ </dd>
+
<dt><var title="">imagedata</var> . <code title="dom-imagedata-width">width</code></dt>
<dt><var title="">imagedata</var> . <code title="dom-imagedata-height">height</code></dt>
<dd>
- <p>Returns the actual dimensions of the data in the <code>ImageData</code> object, in device pixels.</p>
+ <p>Returns the actual dimensions of the data in the
+ <code>ImageData</code> object, in pixels. For objects returned by
+ the non-HD variants of the methods in this API, this will
+ correspond to the dimensions given to the methods. For the HD
+ variants, the number of pixels might be different than the number
+ of corresponding coordinate space units.</p>
</dd>
@@ -46744,55 +46868,123 @@
</dd>
+ <dt><var title="">context</var> . <code title="dom-context-2d-putImageDataHD">putImageDataHD</code>(<var title="">imagedata</var>, <var title="">dx</var>, <var title="">dy</var> [, <var title="">dirtyX</var>, <var title="">dirtyY</var>, <var title="">dirtyWidth</var>, <var title="">dirtyHeight</var> ])</dt>
+
+ <dd>
+
+ <p>Paints the data from the given <code>ImageData</code> object
+ onto the canvas, at the canvas bitmap's native resolution. If a
+ dirty rectangle is provided, only the pixels from that rectangle
+ are painted.</p>
+
+ <p>The <code title="dom-context-2d-globalAlpha">globalAlpha</code>
+ and <code
+ title="dom-context-2d-globalCompositeOperation">globalCompositeOperation</code>
+ attributes, as well as the shadow attributes, are ignored for the
+ purposes of this method call; pixels in the canvas are replaced
+ wholesale, with no composition, alpha blending, no shadows,
+ etc.</p>
+
+ <p>Throws a <code>NotSupportedError</code> exception if any of the
+ arguments are not finite.</p>
+
+ </dd>
+
</dl>
<div class="impl">
- <p>The <dfn
+ <p>The <code
+ title="dom-context-2d-createImageData">createImageData()</code> and
+ <code
+ title="dom-context-2d-createImageDataHD">createImageDataHD()</code>
+ methods are used to instantiate new blank <code>ImageData</code>
+ objects.</p>
+
+ <p>When the <dfn
title="dom-context-2d-createImageData"><code>createImageData()</code></dfn>
- method is used to instantiate new blank <code>ImageData</code>
- objects. When the method is invoked with two arguments <var
- title="">sw</var> and <var title="">sh</var>, it must return an
- <code>ImageData</code> object representing a rectangle with a width
- in equal to the absolute magnitude of <var title="">sw</var> and a
- height equal to the absolute magnitude of <var title="">sh</var>.
- When invoked with a single <var title="">imagedata</var> argument,
- it must return an <code>ImageData</code> object representing a
- rectangle with the same dimensions as the <code>ImageData</code>
- object passed as the argument. The <code>ImageData</code> object
- returned must be filled with transparent black.</p>
+ method is invoked with two arguments <var title="">sw</var> and <var
+ title="">sh</var>, it must return a new <code>ImageData</code>
+ object representing a rectangle with a width in equal to the
+ absolute magnitude of <var title="">sw</var> and a height equal to
+ the absolute magnitude of <var title="">sh</var>. When invoked with
+ a single <var title="">imagedata</var> argument, it must return a
+ new <code>ImageData</code> object representing a rectangle with the
+ same dimensions as the <code>ImageData</code> object passed as the
+ argument. The <code>ImageData</code> object returned must be filled
+ with transparent black.</p>
+ <p>When the <dfn
+ title="dom-context-2d-createImageDataHD"><code>createImageDataHD()</code></dfn>
+ method is invoked (with its two arguments <var title="">sw</var> and
+ <var title="">sh</var>) it must return a new <code>ImageData</code>
+ object representing a rectangle with a width in equal to the
+ absolute magnitude of <var title="">sw</var> multiplied by <var
+ title="">scale</var> and a height equal to the absolute magnitude of
+ <var title="">sh</var> multiplied by <var title="">scale</var>,
+ where <var title="">scale</var> is the number of pixels in the
+ canvas bitmap per coordinate space units. The <code>ImageData</code>
+ object returned must be filled with transparent black.</p>
+
<p>The <dfn
title="dom-context-2d-getImageData"><code>getImageData(<var
title="">sx</var>, <var title="">sy</var>, <var title="">sw</var>,
- <var title="">sh</var>)</code></dfn> method must,
-<!--ADD-TOPIC:Security-->
+ <var title="">sh</var>)</code></dfn> method must, if either the <var
+ title="">sw</var> or <var title="">sh</var> arguments are zero,
+ throw an <code>IndexSizeError</code> exception; otherwise,
+ <!--ADD-TOPIC:Security-->
if the <code>canvas</code> element's <i>origin-clean</i> flag is set
- to false, throw a <code>SecurityError</code> exception; otherwise, it
-<!--REMOVE-TOPIC:Security-->
- must return an <code>ImageData</code> object with width <var
- title="">sw</var> and height <var title="">sh</var> representing the
- underlying pixel data for the area of the canvas denoted by the
- rectangle whose corners are the four points (<var title="">sx</var>,
- <var title="">sy</var>), (<span title=""><var title="">sx</var>+<var
- title="">sw</var></span>, <var title="">sy</var>), (<span
- title=""><var title="">sx</var>+<var title="">sw</var></span>, <span
- title=""><var title="">sy</var>+<var title="">sh</var></span>),
- (<var title="">sx</var>, <span title=""><var title="">sy</var>+<var
- title="">sh</var></span>), in canvas coordinate space units. Pixels
- outside the canvas must be returned as transparent black. Pixels
- must be returned as non-premultiplied alpha values.</p>
+ to false, it must throw a <code>SecurityError</code> exception;
+ <!--REMOVE-TOPIC:Security-->
+ otherwise, it must return an <code>ImageData</code> object with
+ width <var title="">sw</var> and height <var title="">sh</var>
+ representing the canvas bitmap for the area of the canvas denoted by
+ the rectangle whose corners are the four points (<var
+ title="">sx</var>, <var title="">sy</var>), (<span title=""><var
+ title="">sx</var>+<var title="">sw</var></span>, <var
+ title="">sy</var>), (<span title=""><var title="">sx</var>+<var
+ title="">sw</var></span>, <span title=""><var title="">sy</var>+<var
+ title="">sh</var></span>), (<var title="">sx</var>, <span
+ title=""><var title="">sy</var>+<var title="">sh</var></span>), in
+ canvas coordinate space units. If the canvas bitmap does not
+ represent each coordinate space unit square using exactly one pixel,
+ the value of each pixel in the returned abject must be derived from
+ the value(s) of the pixel(s) in the canvas bitmap that correspond to
+ the same coordinate. Pixels outside the canvas must be returned as
+ transparent black. Pixels must be returned as non-premultiplied
+ alpha values.</p>
- <p>If either the <var title="">sw</var> or <var title="">sh</var>
- arguments are zero, the method must instead throw an
- <code>IndexSizeError</code> exception.</p>
+ <p>The <dfn
+ title="dom-context-2d-getImageDataHD"><code>getImageDataHD(<var
+ title="">sx</var>, <var title="">sy</var>, <var title="">sw</var>,
+ <var title="">sh</var>)</code></dfn> method must, if either the <var
+ title="">sw</var> or <var title="">sh</var> arguments are zero,
+ throw an <code>IndexSizeError</code> exception; otherwise,
+ <!--ADD-TOPIC:Security-->
+ if the <code>canvas</code> element's <i>origin-clean</i> flag is set
+ to false, it must throw a <code>SecurityError</code> exception;
+ <!--REMOVE-TOPIC:Security-->
+ otherwise, it must return an <code>ImageData</code> object with
+ width <var title="">sw</var> multiplied by <var title="">scale</var>
+ and height <var title="">sh</var> multiplied by <var
+ title="">scale</var> representing the canvas bitmap data for the
+ area of the canvas denoted by the rectangle whose corners are the
+ four points (<var title="">sx</var>, <var title="">sy</var>), (<span
+ title=""><var title="">sx</var>+<var title="">sw</var></span>, <var
+ title="">sy</var>), (<span title=""><var title="">sx</var>+<var
+ title="">sw</var></span>, <span title=""><var title="">sy</var>+<var
+ title="">sh</var></span>), (<var title="">sx</var>, <span
+ title=""><var title="">sy</var>+<var title="">sh</var></span>), in
+ canvas coordinate space units. Pixels outside the canvas must be
+ returned as transparent black. Pixels must be returned as
+ non-premultiplied alpha values.</p>
- <p><code>ImageData</code> objects must be initialized so that their
- <dfn title="dom-imagedata-width"><code>width</code></dfn> attribute
- is set to the number of pixels per row in the image data, their <dfn
- title="dom-imagedata-height"><code>height</code></dfn> attribute is
- set to the number of rows in the image data, and their <dfn
- title="dom-imagedata-data"><code>data</code></dfn> attribute is
+ <p>New <code>ImageData</code> objects must be initialized so that
+ their <dfn title="dom-imagedata-width"><code>width</code></dfn>
+ attribute is set to the number of pixels per row in the image data,
+ their <dfn title="dom-imagedata-height"><code>height</code></dfn>
+ attribute is set to the number of rows in the image data, and their
+ <dfn title="dom-imagedata-data"><code>data</code></dfn> attribute is
initialized to a <code>Uint8ClampedArray</code> object. The
<code>Uint8ClampedArray</code> object must use a <span>Canvas Pixel
<code>ArrayBuffer</code></span> for its storage, and must have a
@@ -46813,24 +47005,23 @@
component. <a href="#refsTYPEDARRAY">[TYPEDARRAY]</a></p>
<p>The <dfn
- title="dom-context-2d-putImageData"><code>putImageData(<var
- title="">imagedata</var>, <var title="">dx</var>, <var
- title="">dy</var>, <var title="">dirtyX</var>, <var
- title="">dirtyY</var>, <var title="">dirtyWidth</var>, <var
- title="">dirtyHeight</var>)</code></dfn> method writes data from
- <code>ImageData</code> structures back to the canvas.</p>
+ title="dom-context-2d-putImageData"><code>putImageData()</code></dfn>
+ and <dfn
+ title="dom-context-2d-putImageDataHD"><code>putImageDataHD()</code></dfn>
+ methods write data from <code>ImageData</code> structures back to
+ the canvas. Their arguments are: <var title="">imagedata</var>, <var
+ title="">dx</var>, <var title="">dy</var>, <var
+ title="">dirtyX</var>, <var title="">dirtyY</var>, <var
+ title="">dirtyWidth</var>, and <var title="">dirtyHeight</var>.</p>
- <p>When the last four arguments are omitted, they must be assumed to
- have the values 0, 0, the <code
+ <p>When the last four arguments to these methods are omitted, they
+ must be assumed to have the values 0, 0, the <code
title="dom-imagedata-width">width</code> member of the <var
title="">imagedata</var> structure, and the <code
title="dom-imagedata-height">height</code> member of the <var
title="">imagedata</var> structure, respectively.</p>
- <p>When invoked with arguments that do not, per the last few
- paragraphs, cause an exception to be thrown, the <code
- title="dom-context-2d-putImageData">putImageData()</code> method
- must act as follows:</p>
+ <p>When invoked, these methods must act as follows:</p>
<ol>
@@ -46894,73 +47085,84 @@
<li>
- <p>Draw the region of the image data in the horizontal rectangle
- whose top left corner is at (<var title="">dirtyX</var>,<var
- title="">dirtyY</var>) and whose bottom right corner is at (<span
- title=""><var title="">dirtyX</var>+<var
- title="">dirtyWidth</var></span>,<span title=""><var
- title="">dirtyY</var>+<var title="">dirtyHeight</var></span>) onto
- the canvas, aligned such that the top left of the rectangle is at
- coordinate (<var title="">dx</var>,<var title="">dy</var>).</p>
+ <p>Run the appropriate steps from the following list:</p>
- <p>If the <code
- title="dom-context-2d-imageSmoothingEnabled">imageSmoothingEnabled</code>
- attribute is set to true, then the user agent should attempt to
- apply a smoothing algorithm to the image data if the canvas does
- not have exactly one device pixel per coordinate space unit in its
- underlying pixel data.</p>
+ <dl class="switch">
- </li>
+ <dt>If the method was <code title="dom-context-2d-putImageData">putImageData()</code></dt>
- </ol>
+ <dd>
-<!-- XXXXX
+ <p>Draw the region of the image data in the horizontal rectangle
+ whose top left corner is at (<var title="">dirtyX</var>,<var
+ title="">dirtyY</var>) and whose bottom right corner is at
+ (<span title=""><var title="">dirtyX</var>+<var
+ title="">dirtyWidth</var></span>,<span title=""><var
+ title="">dirtyY</var>+<var title="">dirtyHeight</var></span>)
+ onto the canvas, aligned such that the top left of the rectangle
+ is at coordinate (<var title="">dx</var>,<var
+ title="">dy</var>).</p>
- <li>
+ <p>If the <code
+ title="dom-context-2d-imageSmoothingEnabled">imageSmoothingEnabled</code>
+ attribute is set to true, then the user agent should attempt to
+ apply a smoothing algorithm to the image data if the canvas does
+ not have exactly one device pixel per coordinate space unit in
+ the canvas bitmap.</p>
- <p>Let <var title="">scale</var> be the number of device pixels in
- the underlying pixel data of the canvas per coordinate space
- unit.</p>
+ </dd>
- </li>
+ <dt>If the method was <code title="dom-context-2d-putImageDataHD">putImageDataHD()</code></dt>
- <li>
+ <dd>
- <p>Let <var title="">dx<sub>device</sub></var> be the x-coordinate
- of the device pixel in the underlying pixel data of the canvas
- corresponding to the <var title="">dx</var> coordinate in the
- canvas coordinate space.</p>
+ <ol>
- <p>Let <var title="">dy<sub>device</sub></var> be the y-coordinate
- of the device pixel in the underlying pixel data of the canvas
- corresponding to the <var title="">dy</var> coordinate in the
- canvas coordinate space.</p>
+ <li>
+ <p>Let <var title="">dx<sub>device</sub></var> be the x-coordinate
+ of the device pixel in the canvas bitmap corresponding to the <var
+ title="">dx</var> coordinate in the canvas coordinate space.</p>
+
+ <p>Let <var title="">dy<sub>device</sub></var> be the y-coordinate
+ of the device pixel in the canvas bitmap corresponding to the <var
+ title="">dy</var> coordinate in the canvas coordinate space.</p>
+
+ </li>
+
+ <li><p>For all integer values of <var title="">x</var>
+ and <var title="">y</var> where <span title=""><var
+ title="">dirtyX</var> ≤ <var
+ title="">x</var> < <span title=""><var
+ title="">dirtyX</var>+<var title="">dirtyWidth</var></span></span>
+ and <span title=""><var title="">dirtyY</var> ≤ <var
+ title="">y</var> < <span title=""><var
+ title="">dirtyY</var>+<var
+ title="">dirtyHeight</var></span></span>, copy the four channels of
+ the pixel with coordinate (<var title="">x</var>, <var
+ title="">y</var>) in the <var title="">imagedata</var> data
+ structure to the pixel with coordinate (<span title=""><var
+ title="">dx<sub>device</sub></var>+<var title="">x</var></span>,
+ <span title=""><var title="">dy<sub>device</sub></var>+<var
+ title="">y</var></span>) in the canvas bitmap of the
+ canvas.</p></li>
+
+ </ol>
+
+ </dd>
+
+ </dl>
+
</li>
- <li><p>Otherwise, for all integer values of <var title="">x</var>
- and <var title="">y</var> where <span title=""><var
- title="">dirtyX</var> ≤ <var
- title="">x</var> < <span title=""><var
- title="">dirtyX</var>+<var title="">dirtyWidth</var></span></span>
- and <span title=""><var title="">dirtyY</var> ≤ <var
- title="">y</var> < <span title=""><var
- title="">dirtyY</var>+<var
- title="">dirtyHeight</var></span></span>, copy the four channels of
- the pixel with coordinate (<var title="">x</var>, <var
- title="">y</var>) in the <var title="">imagedata</var> data
- structure to the pixel with coordinate (<span title=""><var
- title="">dx<sub>device</sub></var>+<var title="">x</var></span>,
- <span title=""><var title="">dy<sub>device</sub></var>+<var
- title="">y</var></span>) in the underlying pixel data of the
- canvas.</p></li>
+ </ol>
<p>The handling of pixel rounding when the specified coordinates do
not exactly map to the device coordinate space is not defined by
this specification, except that the following must result in no
visible changes to the rendering:</p>
- <pre>context.putImageData(context.getImageData(x, y, w, h), p, q);</pre>
+ <pre>context.putImageDataHD(context.getImageDataHD(x, y, w, h), p, q);</pre>
<p>...for any value of <var title="">x</var>, <var title="">y</var>,
<var title="">w</var>, and <var title="">h</var> and where <var
@@ -46974,30 +47176,25 @@
context.getImageData(0, 0, w, h);</pre>
<p>...must return <code>ImageData</code> objects with the same
- dimensions, for any value of <var title="">w</var> and <var
- title="">h</var>. In other words, while user agents may round the
- arguments of these methods so that they map to device pixel
- boundaries, any rounding performed must be performed consistently
- for all of the <code
- title="dom-context-2d-getImageData">createImageData()</code>, <code
- title="dom-context-2d-getImageData">getImageData()</code> and <code
- title="dom-context-2d-putImageData">putImageData()</code>
- operations.</p>
+ dimensions as each other, and the following two calls:<p>
- <p class="note">This implies that the data returned by <code
- title="dom-context-2d-getImageData">getImageData()</code> is at the
- resolution of the canvas backing store. This is likely to not be one
- device pixel to each CSS pixel if the display used is a high
- resolution display.</p>
+ <pre>context.createImageDataHD(w, h);
+context.getImageDataHD(0, 0, w, h);</pre>
+ <p>...must also return <code>ImageData</code> objects with the same
+ dimensions as each other, for any value of <var title="">w</var> and
+ <var title="">h</var> in both cases. In other words, while user
+ agents may round the arguments of these methods so that they map to
+ device pixel boundaries, any rounding performed must be performed
+ consistently for all of the methods described in this section.</p>
+
<p class="note">Due to the lossy nature of converting to and from
premultiplied alpha color values, pixels that have just been set
using <code
- title="dom-context-2d-putImageData">putImageData()</code> might be
- returned to an equivalent <code
- title="dom-context-2d-getImageData">getImageData()</code> as
+ title="dom-context-2d-putImageDataHD">putImageDataHD()</code> might
+ be returned to an equivalent <code
+ title="dom-context-2d-getImageDataHD">getImageDataHD()</code> as
different values.</p>
--->
<p>The current path, <span
title="dom-context-2d-transformation">transformation matrix</span>,
@@ -47005,10 +47202,8 @@
title="dom-context-2d-globalAlpha">global alpha</span>, the
<span>clipping region</span>, and <span
title="dom-context-2d-globalCompositeOperation">global composition
- operator</span> must not affect the <code
- title="dom-context-2d-getImageData">getImageData()</code> and <code
- title="dom-context-2d-putImageData">putImageData()</code>
- methods.</p>
+ operator</span> must not affect the methods described in this
+ section.</p>
</div>
@@ -47021,7 +47216,7 @@
var context = canvas.getContext('2d');
// create a blank slate
-var data = context.createImageData(canvas.width, canvas.height);
+var data = context.createImageDataHD(canvas.width, canvas.height);
// create some plasma
FillPlasma(data, 'green'); // green plasma
@@ -47030,7 +47225,7 @@
AddCloud(data, data.width/2, data.height/2); // put a cloud in the middle
// paint the plasma+cloud on the canvas
-context.putImageData(data, 0, 0);
+context.putImageDataHD(data, 0, 0);
// support methods
function FillPlasma(data, color) { ... }
@@ -47041,9 +47236,9 @@
<div class="example">
<p>Here is an example of using <code
- title="dom-context-2d-getImageData">getImageData()</code> and <code
- title="dom-context-2d-putImageData">putImageData()</code> to
- implement an edge detection filter.</p>
+ title="dom-context-2d-getImageDataHD">getImageDataHD()</code> and
+ <code title="dom-context-2d-putImageDataHD">putImageDataHD()</code>
+ to implement an edge detection filter.</p>
<pre><!DOCTYPE HTML>
<html>
@@ -47063,10 +47258,10 @@
context.drawImage(image, 0, 0);
// get the image data to manipulate
- var input = context.getImageData(0, 0, canvas.width, canvas.height);
+ var input = context.getImageDataHD(0, 0, canvas.width, canvas.height);
// get an empty slate to put the data into
- var output = context.createImageData(canvas.width, canvas.height);
+ var output = context.createImageDataHD(canvas.width, canvas.height);
// alias some variables for convenience
// notice that we are using input.width and input.height here
@@ -47090,7 +47285,7 @@
}
// put the image data back after manipulation
- context.putImageData(output, 0, 0);
+ context.putImageDataHD(output, 0, 0);
}
</script>
</head>
@@ -47668,16 +47863,15 @@
<p class="note">Thus, in the 2D context, colors used to draw shapes
onto the canvas will exactly match colors obtained through the <code
- title="dom-context-2d-getImageData">getImageData()</code>
+ title="dom-context-2d-getImageDataHD">getImageDataHD()</code>
method.</p>
<p>The <code title="dom-canvas-toDataURL">toDataURL()</code> method
- must not include color space information in the resource
- returned. Where the output format allows it, the color of pixels in
- resources created by <code
- title="dom-canvas-toDataURL">toDataURL()</code> must match those
- returned by the <code
- title="dom-context-2d-getImageData">getImageData()</code>
+ must not include color space information in the resource returned.
+ Where the output format allows it, the color of pixels in resources
+ created by <code title="dom-canvas-toDataURL">toDataURLHD()</code>
+ must match those returned by the <code
+ title="dom-context-2d-getImageDataHD">getImageDataHD()</code>
method.</p>
<p>In user agents that support CSS, the color space used by a
@@ -47779,10 +47973,12 @@
</ul>
<p>The <code title="dom-canvas-toDataURL">toDataURL()</code>, <code
- title="dom-canvas-toBlob">toBlob()</code>, and <code
- title="dom-context-2d-getImageData">getImageData()</code> methods
- check the flag and will throw a <code>SecurityError</code> exception
- rather than leak cross-origin data.</p>
+ title="dom-canvas-toDataURLHD">toDataURLHD()</code>, <code
+ title="dom-canvas-toBlob">toBlob()</code>, <code
+ title="dom-context-2d-getImageData">getImageData()</code>, and <code
+ title="dom-context-2d-getImageDataHD">getImageDataHD()</code>
+ methods check the flag and will throw a <code>SecurityError</code>
+ exception rather than leak cross-origin data.</p>
<p class="note">Even resetting the canvas state by changing its
<code title="attr-canvas-width">width</code> or <code