- From: Sam Ruby via cvs-syncmail <cvsmail@w3.org>
- Date: Fri, 21 Sep 2012 00:14:19 +0000
- To: public-html-commits@w3.org
Update of /sources/public/html5/2dcontext
In directory hutz:/tmp/cvs-serv19855
Modified Files:
Overview.html
Log Message:
commit 68b1f03d27d9a82f6b8bb82e1e9edd8ff99dfc6d
Author: Jay Munro <jaymunro@microsoft.com>
Date: Thu Sep 20 17:12:17 2012 -0700
Removed TextMetrics feature
Removed TextMetrics feature per order from the chairs
Index: Overview.html
===================================================================
RCS file: /sources/public/html5/2dcontext/Overview.html,v
retrieving revision 1.168
retrieving revision 1.169
diff -u -d -r1.168 -r1.169
--- Overview.html 20 Sep 2012 23:44:15 -0000 1.168
+++ Overview.html 21 Sep 2012 00:14:17 -0000 1.169
@@ -324,7 +324,7 @@
<h1>HTML Canvas 2D Context</h1>
<h2 class="no-num no-toc" id=generatedID></h2>
- <h2 class="no-num no-toc" id="editor's-draft-date-1-january-1970">Editor's Draft 20 September 2012</h2>
+ <h2 class="no-num no-toc" id="editor's-draft-date-1-january-1970">Editor's Draft 21 September 2012</h2>
<dl><dt>Latest Published Version:</dt>
<dd><a href=http://www.w3.org/TR/2dcontext/>http://www.w3.org/TR/2dcontext/</a></dd>
<dt>Latest Editor's Draft:</dt>
@@ -447,7 +447,7 @@
Group</a> is the W3C working group responsible for this
specification's progress along the W3C Recommendation
track.
- This specification is the 20 September 2012 Editor's Draft.
+ This specification is the 21 September 2012 Editor's Draft.
</p>
@@ -502,11 +502,10 @@
<li><a href=#hit-regions><span class=secno>1.13 </span>Hit regions</a></li>
<li><a href=#pixel-manipulation><span class=secno>1.14 </span>Pixel manipulation</a></li>
<li><a href=#compositing><span class=secno>1.15 </span>Compositing</a></li>
- <li><a href=#image-smoothing><span class=secno>1.16 </span>Image smoothing</a></li>
- <li><a href=#shadows><span class=secno>1.17 </span>Shadows</a></li>
- <li><a href=#drawing-model><span class=secno>1.18 </span>Drawing model</a></li>
- <li><a href=#best-practices><span class=secno>1.19 </span>Best practices</a></li>
- <li><a href=#examples><span class=secno>1.20 </span>Examples</a></li></ol></li>
+ <li><a href=#shadows><span class=secno>1.16 </span>Shadows</a></li>
+ <li><a href=#drawing-model><span class=secno>1.17 </span>Drawing model</a></li>
+ <li><a href=#best-practices><span class=secno>1.18 </span>Best practices</a></li>
+ <li><a href=#examples><span class=secno>1.19 </span>Examples</a></li></ol></li>
<li><a class=no-num href=#references>References</a></li></ol>
<!--end-toc-->
<hr><h2 id=conformance-requirements><span class=secno>1 </span>Conformance requirements</h2>
@@ -570,8 +569,6 @@
attribute unrestricted double <a href=#dom-context-2d-globalalpha title=dom-context-2d-globalAlpha>globalAlpha</a>; // (default 1.0)
attribute DOMString <a href=#dom-context-2d-globalcompositeoperation title=dom-context-2d-globalCompositeOperation>globalCompositeOperation</a>; // (default source-over)
- // image smoothing
- attribute boolean <a href=#dom-context-2d-imagesmoothingenabled title=dom-context-2d-imageSmoothingEnabled>imageSmoothingEnabled</a>; // (default true)
<!--
// v7 we've also received requests for:
- turning off antialiasing to avoid seams when patterns are painted next to each other
@@ -587,7 +584,7 @@
attribute any <a href=#dom-context-2d-fillstyle title=dom-context-2d-fillStyle>fillStyle</a>; // (default black)
<a href=#canvasgradient>CanvasGradient</a> <a href=#dom-context-2d-createlineargradient title=dom-context-2d-createLinearGradient>createLinearGradient</a>(double x0, double y0, double x1, double y1);
<a href=#canvasgradient>CanvasGradient</a> <a href=#dom-context-2d-createradialgradient title=dom-context-2d-createRadialGradient>createRadialGradient</a>(double x0, double y0, double r0, double x1, double y1, double r1);
- <a href=#canvaspattern>CanvasPattern</a> <a href=#dom-context-2d-createpattern title=dom-context-2d-createPattern>createPattern</a>((<span>HTMLImageElement</span> or <span>HTMLCanvasElement</span> or <span>HTMLVideoElement</span>) image, [TreatNullAs=Emptytring]DOMString repetition);
+ <span>CanvasPattern</span> <a href=#dom-context-2d-createpattern title=dom-context-2d-createPattern>createPattern</a>((<span>HTMLImageElement</span> or <span>HTMLCanvasElement</span> or <span>HTMLVideoElement</span>) image, [TreatNullAs=Emptytring]DOMString repetition);
// shadows
attribute unrestricted double <a href=#dom-context-2d-shadowoffsetx title=dom-context-2d-shadowOffsetX>shadowOffsetX</a>; // (default 0)
@@ -652,11 +649,6 @@
attribute DOMString <a href=#dom-context-2d-linejoin title=dom-context-2d-lineJoin>lineJoin</a>; // "round", "bevel", "miter" (default "miter")
attribute unrestricted double <a href=#dom-context-2d-miterlimit title=dom-context-2d-miterLimit>miterLimit</a>; // (default 10)
- // dashed lines
- void <a href=#dom-context-2d-setlinedash title=dom-context-2d-setLineDash>setLineDash</a>(sequence<unrestricted double> segments); // default empty
- sequence<unrestricted double> <a href=#dom-context-2d-getlinedash title=dom-context-2d-getLineDash>getLineDash</a>();
- attribute unrestricted double <a href=#dom-context-2d-linedashoffset title=dom-context-2d-lineDashOffset>lineDashOffset</a>;
-
// text
attribute DOMString <a href=#dom-context-2d-font title=dom-context-2d-font>font</a>; // (default 10px sans-serif)
attribute DOMString <a href=#dom-context-2d-textalign title=dom-context-2d-textAlign>textAlign</a>; // "start", "end", "left", "right", "center" (default: "start")
@@ -682,27 +674,8 @@
void <a href=#dom-canvasgradient-addcolorstop title=dom-canvasgradient-addColorStop>addColorStop</a>(unrestricted double offset, DOMString color);
};
-interface <dfn id=canvaspattern>CanvasPattern</dfn> {
- // opaque object
- void <a href=#dom-canvaspattern-settransform title=dom-canvaspattern-setTransform>setTransform</a>(<span>SVGMatrix</span> transform);
-};
-
interface <dfn id=textmetrics>TextMetrics</dfn> {
- // x-direction
readonly attribute double <a href=#dom-textmetrics-width title=dom-textmetrics-width>width</a>; // advance width
- readonly attribute double <a href=#dom-textmetrics-actualboundingboxleft title=dom-textmetrics-actualBoundingBoxLeft>actualBoundingBoxLeft</a>;
- readonly attribute double <a href=#dom-textmetrics-actualboundingboxright title=dom-textmetrics-actualBoundingBoxRight>actualBoundingBoxRight</a>;
-
- // y-direction
- readonly attribute double <a href=#dom-textmetrics-fontboundingboxascent title=dom-textmetrics-fontBoundingBoxAscent>fontBoundingBoxAscent</a>;
- readonly attribute double <a href=#dom-textmetrics-fontboundingboxdescent title=dom-textmetrics-fontBoundingBoxDescent>fontBoundingBoxDescent</a>;
- readonly attribute double <a href=#dom-textmetrics-actualboundingboxascent title=dom-textmetrics-actualBoundingBoxAscent>actualBoundingBoxAscent</a>;
- readonly attribute double <a href=#dom-textmetrics-actualboundingboxdescent title=dom-textmetrics-actualBoundingBoxDescent>actualBoundingBoxDescent</a>;
- readonly attribute double <a href=#dom-textmetrics-emheightascent title=dom-textmetrics-emHeightAscent>emHeightAscent</a>;
- readonly attribute double <a href=#dom-textmetrics-emheightdescent title=dom-textmetrics-emHeightDescent>emHeightDescent</a>;
- readonly attribute double <a href=#dom-textmetrics-hangingbaseline title=dom-textmetrics-hangingBaseline>hangingBaseline</a>;
- readonly attribute double <a href=#dom-textmetrics-alphabeticbaseline title=dom-textmetrics-alphabeticBaseline>alphabeticBaseline</a>;
- readonly attribute double <a href=#dom-textmetrics-ideographicbaseline title=dom-textmetrics-ideographicBaseline>ideographicBaseline</a>;
};
dictionary <dfn id=hitregionoptions>HitRegionOptions</dfn> {
@@ -816,8 +789,8 @@
<ul class=brief><li>The current <a href=#transformations title=dom-context-2d-transformation>transformation matrix</a>.</li>
<li>The current <a href=#clipping-region>clipping region</a>.</li>
- <li>The current values of the following attributes: <code title=dom-context-2d-strokeStyle><a href=#dom-context-2d-strokestyle>strokeStyle</a></code>, <code title=dom-context-2d-fillStyle><a href=#dom-context-2d-fillstyle>fillStyle</a></code>, <code title=dom-context-2d-globalAlpha><a href=#dom-context-2d-globalalpha>globalAlpha</a></code>, <code title=dom-context-2d-lineWidth><a href=#dom-context-2d-linewidth>lineWidth</a></code>, <code title=dom-context-2d-lineCap><a href=#dom-context-2d-linecap>lineCap</a></code>, <code title=dom-context-2d-lineJoin><a href=#dom-context-2d-linejoin>lineJoin</a></code>, <code title=dom-context-2d-miterLimit><a href=#dom-context-2d-miterlimit>miterLimit</a></code>, <code title=dom-context-2d-lineDashOffset><a href=#dom-context-2d-linedashoffset>lineDashOffset</a></code>, <code title=dom-context-2d-shadowOffsetX><a href=#dom-context-2d-shadowoffsetx>shadowOffsetX</a></code>, <code title=dom-context-2d-shadowOffsetY><a href=#dom-context-2d-shadowoffsety>shadowOffsetY</a>/code>, <code title=dom-context-2d-shadowBlur><a href=#dom-context-2d-shadowblur>shadowBlur</a></code>, <code title=dom-context-2d-shadowColor><a href=#dom-context-2d-shadowcolor>shadowColor</a></code>, <code title=dom-context-2d-globalCompositeOperation><a href=#dom-context-2d-globalcompositeoperation>globalCompositeOperation</a></code>, <code title=dom-context-2d-font><a href=#dom-context-2d-font>font</a></code>, <code title=dom-context-2d-textAlign><a href=#dom-context-2d-textalign>textAlign</a></code>, <code title=dom-context-2d-textBaseline><a href=#dom-context-2d-textbaseline>textBaseline</a></code>, <code title=dom-context-2d-imageSmoothingEnabled><a href=#dom-context-2d-imagesmoothingenabled>imageSmoothingEnabled</a></code>.</li>
- <li>The current <a href=#dash-list>dash list</a>.</li>
+ <li>The current values of the following attributes: <code title=dom-context-2d-strokeStyle><a href=#dom-context-2d-strokestyle>strokeStyle</a></code>, <code title=dom-context-2d-fillStyle><a href=#dom-context-2d-fillstyle>fillStyle</a></code>, <code title=dom-context-2d-globalAlpha><a href=#dom-context-2d-globalalpha>globalAlpha</a></code>, <code title=dom-context-2d-lineWidth><a href=#dom-context-2d-linewidth>lineWidth</a></code>, <code title=dom-context-2d-lineCap><a href=#dom-context-2d-linecap>lineCap</a></code>, <code title=dom-context-2d-lineJoin><a href=#dom-context-2d-linejoin>lineJoin</a></code>, <code title=dom-context-2d-miterLimit><a href=#dom-context-2d-miterlimit>miterLimit</a></code>, <code title=dom-context-2d-lineDashOffset>lineDashOffset</code>, <code title=dom-context-2d-shadowOffsetX><a href=#dom-context-2d-shadowoffsetx>shadowOffsetX</a></code>, <code title=dom-context-2d-shadowOffsetY><a href=#dom-context-2d-shadowoffsety>shadowOffsetY</a></code>, <code title=dom-context-2d-shadowBur><a href=#dom-context-2d-shadowblur>shadowBlur</a></code>, <code title=dom-context-2d-shadowColor><a href=#dom-context-2d-shadowcolor>shadowColor</a></code>, <code title=dom-context-2d-globalCompositeOperation><a href=#dom-context-2d-globalcompositeoperation>globalCompositeOperation</a></code>, <code title=dom-context-2d-font><a href=#dom-context-2d-font>font</a></code>, <code title=dom-context-2d-textAlign><a href=#dom-context-2d-textalign>textAlign</a></code>, <code title=dom-context-2d-textBaseline><a href=#dom-context-2d-textbaseline>textBaseline</a></code>.</li>
+ <li>The current <span>dash list</span>.</li>
</ul><p class=note>The <a href=#current-default-path>current default path</a> and the
current bitmap are not part of the drawing state. The <a href=#current-default-path>current
default path</a> is persistent, and can only be reset using the
@@ -966,43 +939,6 @@
</dd>
-
- <dt><var title="">context</var> . <code title=dom-context-2d-setLineDash><a href=#dom-context-2d-setlinedash>setLineDash</a></code>(<var title="">segments</var>)</dt>
- <dt><var title="">styles</var> . <code title=dom-context-2d-setLineDash><a href=#dom-context-2d-setlinedash>setLineDash</a></code>(<var title="">segments</var>)</dt>
-
- <dd>
-
- <p>Sets the current line dash pattern (as used when stroking). The
- argument is an array of distances for which to alternately have
- the line on and the line off.</p>
-
- </dd>
-
-
- <dt><var title="">segments</var> = <var title="">context</var> . <code title=dom-context-2d-getLineDash><a href=#dom-context-2d-getlinedash>getLineDash</a></code>()</dt>
- <dt><var title="">segments</var> = <var title="">styles</var> . <code title=dom-context-2d-getLineDash><a href=#dom-context-2d-getlinedash>getLineDash</a></code>()</dt>
-
- <dd>
-
- <p>Returns a copy of the current line dash pattern. The array
- returned will always have an even number of entries (i.e. the
- pattern is normalized).</p>
-
- </dd>
-
-
- <dt><var title="">context</var> . <code title=dom-context-2d-lineDashOffset><a href=#dom-context-2d-linedashoffset>lineDashOffset</a></code></dt>
- <dt><var title="">styles</var> . <code title=dom-context-2d-lineDashOffset><a href=#dom-context-2d-linedashoffset>lineDashOffset</a></code></dt>
-
- <dd>
-
- <p>Returns the phase offset (in the same units as the line dash pattern).</p>
-
- <p>Can be set, to change the phase offset. Values that are not
- finite values are ignored.</p>
-
- </dd>
-
</dl><div class=impl>
<p>Objects that implement the <code><a href=#canvasdrawingstyles>CanvasDrawingStyles</a></code>
@@ -1063,44 +999,6 @@
interface is created, the <code title=dom-context-2d-miterLimit><a href=#dom-context-2d-miterlimit>miterLimit</a></code> attribute must
initially have the value <code>10.0</code>.</p>
- <hr><p>Each <code><a href=#canvasdrawingstyles>CanvasDrawingStyles</a></code> object has a <dfn id=dash-list>dash
- list</dfn>, which is either empty or consists of an even number of
- non-negative numbers. Initially, the <a href=#dash-list>dash list</a> must be
- empty.</p>
-
- <p>When the <dfn id=dom-context-2d-setlinedash title=dom-context-2d-setLineDash><code>setLineDash()</code></dfn>
- method is invoked, it must run the following steps:</p>
-
- <ol><li><p>Let <var title="">a</var> be a copy of the array provided as
- the argument.</p></li>
-
- <li><p>If any value in the array is not finite (e.g. an Infinity or
- a NaN value), or if any value is negative (less than zero), then
- abort these steps.</p></li>
-
- <li><p>If the number of elements in <var title="">a</var> is odd,
- then let <var title="">a</var> be the concatentation of two copies
- of <var title="">a</var>.</p></li>
-
- <li><p>Let the object's <a href=#dash-list>dash list</a> be <var title="">a</var>.</p></li>
-
- </ol><p>When the <dfn id=dom-context-2d-getlinedash title=dom-context-2d-getLineDash><code>getLineDash()</code></dfn>
- method is invoked, it must return a newly created array whose values
- are the values of the object's <a href=#dash-list>dash list</a>, in the same
- order.</p>
-
- <p>It is sometimes useful to change the "phase" of the dash pattern,
- e.g. to achieve a "marching ants" effect. The phase can be set using
- the <dfn id=dom-context-2d-linedashoffset title=dom-context-2d-lineDashOffset><code>lineDashOffset</code></dfn>
- attribute. On getting, it must return the current value. On setting,
- infinite and NaN values must be ignored, leaving the value
- unchanged; other values must change the current value to the new
- value.</p>
-
- <p>When the object implementing the <code><a href=#canvasdrawingstyles>CanvasDrawingStyles</a></code>
- interface is created, the <code title=dom-context-2d-lineDashOffset><a href=#dom-context-2d-linedashoffset>lineDashOffset</a></code>
- attribute must initially have the value <code>0.0</code>.</p>
-
<hr><p>When a user agent is to <dfn id=trace-a-path>trace a <span>path</span></dfn>,
given an object <var title="">style</var> that implements the
<code><a href=#canvasdrawingstyles>CanvasDrawingStyles</a></code> interface, it must run the following
@@ -1129,14 +1027,14 @@
the first point to a join (from the newly added closing line to the
first line).</p>
- </li><li><p>If the <var title="">styles</var> <a href=#dash-list>dash list</a> is
+ </li><li><p>If the <var title="">styles</var> <span>dash list</span> is
empty, jump to the step labeled <i>joins</i>.</p></li>
<li><p>Let <var title="">width</var> be the aggregate length of all
the lines of all the subpaths in <var title="">path</var>, in
coordinate space units.</p></li>
- <li><p>Let <var title="">offset</var> be the value of the <var title="">styles</var> <code title=dom-context-2d-lineDashOffset><a href=#dom-context-2d-linedashoffset>lineDashOffset</a></code>, in
+ <li><p>Let <var title="">offset</var> be the value of the <var title="">styles</var> <code title=dom-context-2d-lineDashOffset>lineDashOffset</code>, in
coordinate space units.</p></li>
<li>
@@ -1166,8 +1064,8 @@
other states being <i>on</i> and <i>zero-on</i>).</p></li>
<li><p><i>Dash On</i>: Let <var title="">segment length</var> be
- the value of the <var title="">styles</var> <a href=#dash-list>dash
- list</a>'s <var title="">index</var>th entry.</p></li>
+ the value of the <var title="">styles</var> <span>dash
+ list</span>'s <var title="">index</var>th entry.</p></li>
<li><p>Increment <var title="">position</var> by <var title="">segment length</var>.</p></li>
@@ -1179,8 +1077,8 @@
<li><p>Increment <var title="">index</var> by one.</p></li>
<li><p><i>Dash Off</i>: Let <var title="">segment length</var> be
- the value of the <var title="">styles</var> <a href=#dash-list>dash
- list</a>'s <var title="">index</var>th entry.</p></li>
+ the value of the <var title="">styles</var> <span>dash
+ list</span>'s <var title="">index</var>th entry.</p></li>
<li><p>Let <var title="">start</var> be the offset <var title="">position</var> on <var title="">L</var>.</p></li>
@@ -1251,7 +1149,7 @@
<li><p>Increment <var title="">index</var> by one. If it is equal
to the number of entries in the <var title="">styles</var>
- <a href=#dash-list>dash list</a>, then let <var title="">index</var> be
+ <span>dash list</span>, then let <var title="">index</var> be
0.</p></li>
<li><p>Return to the step labeled <i>dash on</i>.</p></li>
@@ -2690,7 +2588,7 @@
<p>Can be set, to change the fill style.</p>
<p>The style can be either a string containing a CSS color, or a
- <code><a href=#canvasgradient>CanvasGradient</a></code> or <code><a href=#canvaspattern>CanvasPattern</a></code>
+ <code><a href=#canvasgradient>CanvasGradient</a></code> or <code>CanvasPattern</code>
object. Invalid values are ignored.</p>
</dd>
@@ -2704,7 +2602,7 @@
<p>Can be set, to change the stroke style.</p>
<p>The style can be either a string containing a CSS color, or a
- <code><a href=#canvasgradient>CanvasGradient</a></code> or <code><a href=#canvaspattern>CanvasPattern</a></code>
+ <code><a href=#canvasgradient>CanvasGradient</a></code> or <code>CanvasPattern</code>
object. Invalid values are ignored.</p>
</dd>
@@ -2745,24 +2643,24 @@
the shapes.</p>
<p>Both attributes can be either strings,
- <code><a href=#canvasgradient>CanvasGradient</a></code>s, or <code><a href=#canvaspattern>CanvasPattern</a></code>s. On
+ <code><a href=#canvasgradient>CanvasGradient</a></code>s, or <code>CanvasPattern</code>s. On
setting, strings must be <span title="parsed as a CSS <color>
value">parsed as CSS <color> values</span> and the color
assigned, and <code><a href=#canvasgradient>CanvasGradient</a></code> and
- <code><a href=#canvaspattern>CanvasPattern</a></code> objects must be assigned themselves. <a href=#refsCSSCOLOR>[CSSCOLOR]</a> If the value is a string but
+ <code>CanvasPattern</code> objects must be assigned themselves. <a href=#refsCSSCOLOR>[CSSCOLOR]</a> If the value is a string but
cannot be <span>parsed as a CSS <color> value</span>, or is
neither a string, a <code><a href=#canvasgradient>CanvasGradient</a></code>, nor a
- <code><a href=#canvaspattern>CanvasPattern</a></code>, then it must be ignored, and the
+ <code>CanvasPattern</code>, then it must be ignored, and the
attribute must retain its previous value.</p>
- <p>When set to a <code><a href=#canvaspattern>CanvasPattern</a></code> or
+ <p>When set to a <code>CanvasPattern</code> or
<code><a href=#canvasgradient>CanvasGradient</a></code> object, the assignment is
<span>live</span>, meaning that changes made to the object after the
assignment do affect subsequent stroking or filling of shapes.</p>
<p>On getting, if the value is a color, then the <a href=#serialization-of-a-color title="serialization of a color">serialization of the color</a>
must be returned. Otherwise, if it is not a color but a
- <code><a href=#canvasgradient>CanvasGradient</a></code> or <code><a href=#canvaspattern>CanvasPattern</a></code>, then the
+ <code><a href=#canvasgradient>CanvasGradient</a></code> or <code>CanvasPattern</code>, then the
respective object must be returned. (Such objects are opaque and
therefore only useful for assigning to other attributes or for
comparison to other gradients or patterns.)</p>
@@ -2950,13 +2848,13 @@
</div>
<hr><p>Patterns are represented by objects implementing the opaque
- <code><a href=#canvaspattern>CanvasPattern</a></code> interface.</p>
+ <code>CanvasPattern</code> interface.</p>
<dl class=domintro><dt><var title="">pattern</var> = <var title="">context</var> . <code title=dom-context-2d-createPattern><a href=#dom-context-2d-createpattern>createPattern</a></code>(<var title="">image</var>, <var title="">repetition</var>)</dt>
<dd>
- <p>Returns a <code><a href=#canvaspattern>CanvasPattern</a></code> object that uses the given image
+ <p>Returns a <code>CanvasPattern</code> object that uses the given image
and repeats in the direction(s) given by the <var title="">repetition</var> argument.</p>
<p>The allowed values for <var title="">repetition</var> are <code title="">repeat</code> (both directions), <code title="">repeat-x</code> (horizontal only), <code title="">repeat-y</code> (vertical only), and <code title="">no-repeat</code> (neither). If the <var title="">repetition</var> argument is empty, the value <code title="">repeat</code> is used.</p>
@@ -2969,15 +2867,6 @@
</dd>
- <dt><var title="">pattern</var> . <code title=dom-canvaspattern-setTransform><a href=#dom-canvaspattern-settransform>setTransform</a></code>(<var title="">transform</var>)</dt>
-
- <dd>
-
- <p>Sets the transformation matrix that will be used when rendering
- the pattern during a fill or stroke painting operation.</p>
-
- </dd>
-
</dl><div class=impl>
<p>To create objects of this type, the <dfn id=dom-context-2d-createpattern title=dom-context-2d-createPattern><code>createPattern(<var title="">image</var>, <var title="">repetition</var>)</code></dfn>
@@ -2993,7 +2882,7 @@
value is given, then the user agent must throw a <code>SyntaxError</code>
exception. User agents must recognize the four values described above
exactly (e.g. they must not do case folding). Except as specified
- below, the method must return a <code><a href=#canvaspattern>CanvasPattern</a></code> object
+ below, the method must return a <code>CanvasPattern</code> object
suitably initialized.</p>
<p>The <var title="">image</var> argument is an instance of either
@@ -3015,16 +2904,6 @@
exception.</p>
<!-- drawImage() has an equivalent paragraph -->
- <p>Patterns have a transformation matrix, which controls how the
- pattern is used when it is painted. Initially, a pattern's
- transformation matrix must be the identity transform.</p>
-
- <p>When the <dfn id=dom-canvaspattern-settransform title=dom-canvaspattern-setTransform><code>setTransform()</code></dfn>
- method is invoked on the pattern, the user agent must replace the
- pattern's transformation matrix with the one described by the
- <code>SVGMatrix</code> object provided as an argument to the
- method.</p>
-
<p>When a pattern is to be rendered within an area, the user agent
must run the following steps to determine what is rendered:</p>
@@ -3043,12 +2922,7 @@
<p>If the original image data is a bitmap image, the value painted
at a point in the area of the repetitions is computed by filtering
- the original image data. If the <code title=dom-context-2d-imageSmoothingEnabled><a href=#dom-context-2d-imagesmoothingenabled>imageSmoothingEnabled</a></code>
- attribute is set to true, then the user agent may use any
- filtering algorithm (for example bilinear interpolation or
- nearest-neighbor). If the <code title=dom-context-2d-imageSmoothingEnabled><a href=#dom-context-2d-imagesmoothingenabled>imageSmoothingEnabled</a></code>
- attribute is set to false, the image must be rendered using
- nearest-neighbor interpolation. When such a filtering algorithm
+ the original image data. When such a filtering algorithm
requires a pixel value from outside the original image data, it
must instead use the value from wrapping the pixel's coordinates
to the original image's dimensions. (That is, the filter uses
@@ -3057,10 +2931,7 @@
</p></li>
- <li><p>Transform the resulting bitmap according to the pattern's
- transformation matrix.</p></li>
-
- <li><p>Transform the resulting bitmap again, this time according to
+ <li><p>Transform the resulting bitmap according to
the <a href=#transformations title=dom-context-2d-transformation>current
transformation matrix</a>.</p></li>
@@ -3213,18 +3084,7 @@
</dd>
<dt><var title="">metrics</var> . <code title=dom-textmetrics-width><a href=#dom-textmetrics-width>width</a></code></dt>
- <dt><var title="">metrics</var> . <code title=dom-textmetrics-actualBoundingBoxLeft><a href=#dom-textmetrics-actualboundingboxleft>actualBoundingBoxLeft</a></code></dt>
- <dt><var title="">metrics</var> . <code title=dom-textmetrics-actualBoundingBoxRight><a href=#dom-textmetrics-actualboundingboxright>actualBoundingBoxRight</a></code></dt>
- <dt><var title="">metrics</var> . <code title=dom-textmetrics-fontBoundingBoxAscent><a href=#dom-textmetrics-fontboundingboxascent>fontBoundingBoxAscent</a></code></dt>
- <dt><var title="">metrics</var> . <code title=dom-textmetrics-fontBoundingBoxDescent><a href=#dom-textmetrics-fontboundingboxdescent>fontBoundingBoxDescent</a></code></dt>
- <dt><var title="">metrics</var> . <code title=dom-textmetrics-actualBoundingBoxAscent><a href=#dom-textmetrics-actualboundingboxascent>actualBoundingBoxAscent</a></code></dt>
- <dt><var title="">metrics</var> . <code title=dom-textmetrics-actualBoundingBoxDescent><a href=#dom-textmetrics-actualboundingboxdescent>actualBoundingBoxDescent</a></code></dt>
- <dt><var title="">metrics</var> . <code title=dom-textmetrics-emHeightAscent><a href=#dom-textmetrics-emheightascent>emHeightAscent</a></code></dt>
- <dt><var title="">metrics</var> . <code title=dom-textmetrics-emHeightDescent><a href=#dom-textmetrics-emheightdescent>emHeightDescent</a></code></dt>
- <dt><var title="">metrics</var> . <code title=dom-textmetrics-hangingBaseline><a href=#dom-textmetrics-hangingbaseline>hangingBaseline</a></code></dt>
- <dt><var title="">metrics</var> . <code title=dom-textmetrics-alphabeticBaseline><a href=#dom-textmetrics-alphabeticbaseline>alphabeticBaseline</a></code></dt>
- <dt><var title="">metrics</var> . <code title=dom-textmetrics-ideographicBaseline><a href=#dom-textmetrics-ideographicbaseline>ideographicBaseline</a></code></dt>
-
+
<dd>
<p>Returns the measurement described below.</p>
@@ -3463,63 +3323,7 @@
<dl><dt><dfn id=dom-textmetrics-width title=dom-textmetrics-width><code>width</code></dfn> attribute</dt>
<dd><p>The width of that inline box, in CSS pixels. (The text's advance width.)</p></dd>
-
- <dt><dfn id=dom-textmetrics-actualboundingboxleft title=dom-textmetrics-actualBoundingBoxLeft><code>actualBoundingBoxLeft</code></dfn> attribute</dt>
-
- <dd>
- <p>The distance parallel to the baseline from the alignment point given by the <code title=dom-context-2d-textAlign><a href=#dom-context-2d-textalign>textAlign</a></code> attribute to the left side of the bounding rectangle of the given text, in CSS pixels; positive numbers indicating a distance going left from the given alignment point.
- </p><p class=note>The sum of this value and the next (<code title=dom-textmetrics-actualBoundingBoxRight><a href=#dom-textmetrics-actualboundingboxright>actualBoundingBoxRight</a></code>) can be wider than the width of the inline box (<code title=dom-textmetrics-width><a href=#dom-textmetrics-width>width</a></code>), in particular with slanted fonts where characters overhang their advance width.</p>
-
- </dd>
-
- <dt><dfn id=dom-textmetrics-actualboundingboxright title=dom-textmetrics-actualBoundingBoxRight><code>actualBoundingBoxRight</code></dfn> attribute</dt>
-
- <dd>
- <p>The distance parallel to the baseline from the alignment point given by the <code title=dom-context-2d-textAlign><a href=#dom-context-2d-textalign>textAlign</a></code> attribute to the right side of the bounding rectangle of the given text, in CSS pixels; positive numbers indicating a distance going right from the given alignment point.</p>
- </dd>
-
- <dt><dfn id=dom-textmetrics-fontboundingboxascent title=dom-textmetrics-fontBoundingBoxAscent><code>fontBoundingBoxAscent</code></dfn> attribute</dt>
-
- <dd>
- <p>The distance from the horizontal line indicated by the <code title=dom-context-2d-textBaseline><a href=#dom-context-2d-textbaseline>textBaseline</a></code> attribute to the top of the highest bounding rectangle of all the fonts used to render the text, in CSS pixels; positive numbers indicating a distance going up from the given baseline.</p>
- <p class=note>This value and the next are useful when rendering a background that must have a consistent height even if the exact text being rendered changes. The <code title=dom-textmetrics-actualBoundingBoxAscent><a href=#dom-textmetrics-actualboundingboxascent>actualBoundingBoxAscent</a></code> attribute (and its corresponding attribute for the descent) are useful when drawing a bounding box around specific text.</p>
- </dd>
-
- <dt><dfn id=dom-textmetrics-fontboundingboxdescent title=dom-textmetrics-fontBoundingBoxDescent><code>fontBoundingBoxDescent</code></dfn> attribute</dt>
-
- <dd><p>The distance from the horizontal line indicated by the <code title=dom-context-2d-textBaseline><a href=#dom-context-2d-textbaseline>textBaseline</a></code> attribute to the bottom of the lowest bounding rectangle of all the fonts used to render the text, in CSS pixels; positive numbers indicating a distance going down from the given baseline.</p></dd>
-
- <dt><dfn id=dom-textmetrics-actualboundingboxascent title=dom-textmetrics-actualBoundingBoxAscent><code>actualBoundingBoxAscent</code></dfn> attribute</dt>
-
- <dd>
- <p>The distance from the horizontal line indicated by the <code title=dom-context-2d-textBaseline><a href=#dom-context-2d-textbaseline>textBaseline</a></code> attribute to the top of the bounding rectangle of the given text, in CSS pixels; positive numbers indicating a distance going up from the given baseline.
- </p><p class=note>This number can vary greatly based on the input text, even if the first font specified covers all the characters in the input. For example, the <code title=dom-textmetrics-actualBoundingBoxAscent><a href=#dom-textmetrics-actualboundingboxascent>actualBoundingBoxAscent</a></code> of a lowercase "o" from an alphabetic baseline would be less than that of an uppercase "F". The value can easily be negative; for example, the distance from the top of the em box (<code title=dom-context-2d-textBaseline><a href=#dom-context-2d-textbaseline>textBaseline</a></code> value "<code title=dom-context-2d-textBaseline-top><a href=#dom-context-2d-textbaseline-top>top</a></code>") to the top of the bounding rectangle when the given text is just a single comma "<code title="">,</code>" would likely (unless the font is quite unusual) be negative.</p>
- </dd>
-
- <dt><dfn id=dom-textmetrics-actualboundingboxdescent title=dom-textmetrics-actualBoundingBoxDescent><code>actualBoundingBoxDescent</code></dfn> attribute</dt>
-
- <dd><p>The distance from the horizontal line indicated by the <code title=dom-context-2d-textBaseline><a href=#dom-context-2d-textbaseline>textBaseline</a></code> attribute to the bottom of the bounding rectangle of the given text, in CSS pixels; positive numbers indicating a distance going down from the given baseline.</p></dd>
-
- <dt><dfn id=dom-textmetrics-emheightascent title=dom-textmetrics-emHeightAscent><code>emHeightAscent</code></dfn> attribute</dt>
-
- <dd><p>The distance from the horizontal line indicated by the <code title=dom-context-2d-textBaseline><a href=#dom-context-2d-textbaseline>textBaseline</a></code> attribute to the top of the em square in the line box, in CSS pixels; positive numbers indicating that the given baseline is below the top of the em square (so this value will usually be positive). Zero if the given baseline is the top of the em square; half the font size if the given baseline is the middle of the em square.</p></dd>
-
- <dt><dfn id=dom-textmetrics-emheightdescent title=dom-textmetrics-emHeightDescent><code>emHeightDescent</code></dfn> attribute</dt>
-
- <dd><p>The distance from the horizontal line indicated by the <code title=dom-context-2d-textBaseline><a href=#dom-context-2d-textbaseline>textBaseline</a></code> attribute to the bottom of the em square in the line box, in CSS pixels; positive numbers indicating that the given baseline is below the bottom of the em square (so this value will usually be negative). (Zero if the given baseline is the top of the em square.)</p></dd>
-
- <dt><dfn id=dom-textmetrics-hangingbaseline title=dom-textmetrics-hangingBaseline><code>hangingBaseline</code></dfn> attribute</dt>
-
- <dd><p>The distance from the horizontal line indicated by the <code title=dom-context-2d-textBaseline><a href=#dom-context-2d-textbaseline>textBaseline</a></code> attribute to the hanging baseline of the line box, in CSS pixels; positive numbers indicating that the given baseline is below the hanging baseline. (Zero if the given baseline is the hanging baseline.)</p></dd>
-
- <dt><dfn id=dom-textmetrics-alphabeticbaseline title=dom-textmetrics-alphabeticBaseline><code>alphabeticBaseline</code></dfn> attribute</dt>
-
- <dd><p>The distance from the horizontal line indicated by the <code title=dom-context-2d-textBaseline><a href=#dom-context-2d-textbaseline>textBaseline</a></code> attribute to the alphabetic baseline of the line box, in CSS pixels; positive numbers indicating that the given baseline is below the alphabetic baseline. (Zero if the given baseline is the alphabetic baseline.)</p></dd>
-
- <dt><dfn id=dom-textmetrics-ideographicbaseline title=dom-textmetrics-ideographicBaseline><code>ideographicBaseline</code></dfn> attribute</dt>
-
- <dd><p>The distance from the horizontal line indicated by the <code title=dom-context-2d-textBaseline><a href=#dom-context-2d-textbaseline>textBaseline</a></code> attribute to the ideographic baseline of the line box, in CSS pixels; positive numbers indicating that the given baseline is below the ideographic baseline. (Zero if the given baseline is the ideographic baseline.)</p></dd>
-
+
</dl><p class=note>Glyphs rendered using <code title=dom-context-2d-fillText><a href=#dom-context-2d-filltext>fillText()</a></code> and <code title=dom-context-2d-strokeText><a href=#dom-context-2d-stroketext>strokeText()</a></code> can spill out
of the box given by the font size (the em square size) and the width
returned by <code title=dom-context-2d-measureText><a href=#dom-context-2d-measuretext>measureText()</a></code> (the text
@@ -4024,16 +3828,6 @@
suggested that 5,5,-2,-2 was different than 3,3,2,2; this is trying
to clarify that this is no the case. --></p>
- <p>If the <code title=dom-context-2d-imageSmoothingEnabled><a href=#dom-context-2d-imagesmoothingenabled>imageSmoothingEnabled</a></code>
- attribute is set to true, then the user agent should attempt to
- apply a smoothing algorithm to the image data when it is scaled.
- Otherwise, the image must be rendered using nearest-neighbor
- interpolation.</p>
-
- <p class=note>This specification does not define the precise
- algorithm to use when scaling an image when the <code title=dom-context-2d-imageSmoothingEnabled><a href=#dom-context-2d-imagesmoothingenabled>imageSmoothingEnabled</a></code>
- attribute is set to true.</p>
-
<p class=note>When a canvas is drawn onto itself, the <a href=#drawing-model>drawing
model</a> requires the source to be copied before the image is drawn
back onto the canvas, so it is possible to copy parts of a canvas
@@ -5273,35 +5067,7 @@
</div>
-
-
- <h6 id=image-smoothing><span class=secno>1.16 </span>Image smoothing</h6>
-
- <dl class=domintro><dt><var title="">context</var> . <code title=dom-context-2d-imageSmoothingEnabled><a href=#dom-context-2d-imagesmoothingenabled>imageSmoothingEnabled</a></code> [ = <var title="">value</var> ]</dt>
-
- <dd>
-
- <p>Returns whether pattern fills and the <code title=dom-context-2d-drawImage><a href=#dom-context-2d-drawimage>drawImage()</a></code> method will
- attempt to smooth images if they have to rescale them (as opposed
- to just rendering the images with "big pixels").</p>
-
- <p>Can be set, to change whether images are smoothed (true) or not
- (false).</p>
-
- </dd>
-
- </dl><div class=impl>
-
- <p>The <dfn id=dom-context-2d-imagesmoothingenabled title=dom-context-2d-imageSmoothingEnabled><code>imageSmoothingEnabled</code></dfn>
- attribute, on getting, must return the last value it was set to. On
- setting, it must be set to the new value. When the
- <code><a href=#canvasrenderingcontext2d>CanvasRenderingContext2D</a></code> object is created, the
- attribute must be set to true.</p>
-
- </div>
-
-
- <h6 id=shadows><span class=secno>1.17 </span><dfn>Shadows</dfn></h6>
+ <h6 id=shadows><span class=secno>1.16 </span><dfn>Shadows</dfn></h6>
<p>All drawing operations are affected by the four global shadow
attributes.</p>
@@ -5442,7 +5208,7 @@
<div class=impl>
- <h6 id=drawing-model><span class=secno>1.18 </span><dfn>Drawing model</dfn></h6>
+ <h6 id=drawing-model><span class=secno>1.17 </span><dfn>Drawing model</dfn></h6>
<p>When a shape or image is painted, user agents must follow these
steps, in the order given (or act as if they do):</p>
@@ -5473,7 +5239,7 @@
</ol></div>
- <h6 id=best-practices><span class=secno>1.19 </span>Best practices</h6>
+ <h6 id=best-practices><span class=secno>1.18 </span>Best practices</h6>
<p><i>This section is non-normative.</i></p>
<p>When a canvas is interactive, authors should include focusable
@@ -5534,7 +5300,7 @@
attribute.</p>
- <h6 id=examples><span class=secno>1.20 </span>Examples</h6>
+ <h6 id=examples><span class=secno>1.19 </span>Examples</h6>
<p><i>This section is non-normative.</i></p>
<div class=example>
Received on Friday, 21 September 2012 00:14:21 UTC