[html5] r8538 - / images
whatwg at whatwg.org
whatwg at whatwg.org
Wed Mar 12 15:01:05 PDT 2014
Author: ianh
Date: 2014-03-12 15:01:04 -0700 (Wed, 12 Mar 2014)
New Revision: 8538
Added:
images/Qp-overlap-outline.png
images/Qp-overlap.png
Modified:
complete.html
index
source
Log:
[giow] (0) Make the addText() methods on Path not create overlapping subpaths.
Affected topics: Canvas
Modified: complete.html
===================================================================
--- complete.html 2014-03-10 21:00:43 UTC (rev 8537)
+++ complete.html 2014-03-12 22:01:04 UTC (rev 8538)
@@ -298,7 +298,7 @@
<header class=head id=head><p><a href=http://www.whatwg.org/ class=logo><img width=101 src=/images/logo alt=WHATWG height=101></a></p>
<hgroup><h1 class=allcaps>HTML</h1>
- <h2 class="no-num no-toc">Living Standard — Last Updated 10 March 2014</h2>
+ <h2 class="no-num no-toc">Living Standard — Last Updated 12 March 2014</h2>
</hgroup><dl><dt><strong>Web developer edition:</strong></dt>
<dd><strong><a href=http://developers.whatwg.org/>http://developers.whatwg.org/</a></strong></dd>
<dt>Multiple-page version:</dt>
@@ -56740,23 +56740,76 @@
<li><p>Move all the shapes in <var title="">glyphs</var> to the right by <var title="">x</var>
CSS pixels and down by <var title="">y</var> CSS pixels.</li>
- <li><p>Let <var title="">glyph subpaths</var> be a <a href=#concept-path title=concept-path>path</a> describing the shapes given
- in <var title="">glyphs</var>, with each CSS pixel in the coordinate space of <var title="">glyphs</var> mapped to one coordinate space unit in <var title="">glyph subpaths</var>.
- Subpaths in <var title="">glyph subpaths</var> must wind clockwise, regardless of how the user
+<!--CLEANUP-->
+ <li><p>Let <var title="">glyph paths</var> be a list of <a href=#concept-path title=concept-path>paths</a> describing the shapes given
+ in <var title="">glyphs</var>, with each CSS pixel in the coordinate space of <var title="">glyphs</var> mapped to one coordinate space unit in <var title="">glyph paths</var>.
+ Subpaths in <var title="">glyph paths</var> must wind clockwise, regardless of how the user
agent's font subsystem renders fonts and regardless of how the fonts themselves are defined.</p>
- <li><p>Transform all the coordinates and lines in <var title="">glyph subpaths</var> by the
+ <li><p>Transform all the coordinates and lines in <var title="">glyph paths</var> by the
transformation matrix <var title="">transform</var>, if it is not null.</li>
- <li><p>If the method is <code title=dom-path-addPathByStrokingText><a href=#dom-path-addpathbystrokingtext>addPathByStrokingText()</a></code>, replace <var title="">glyph subpaths</var> by the result of <a href=#trace-a-path title="trace a path">tracing</a> <var title="">glyph subpaths</var>, using the <code><a href=#canvasdrawingstyles>CanvasDrawingStyles</a></code> object argument for the
+<!--CLEANUP-->
+ <li><p>If the method is <code title=dom-path-addPathByStrokingText><a href=#dom-path-addpathbystrokingtext>addPathByStrokingText()</a></code>, replace <var title="">glyph paths</var> by the result of <a href=#trace-a-path title="trace a path">tracing</a> each <a href=#concept-path title=concept-path>path</a> in <var title="">glyph paths</var>, using the <code><a href=#canvasdrawingstyles>CanvasDrawingStyles</a></code> object argument for the
line styles.</p>
- <li><p>Let (<var title="">x<sub title="">final</sub></var>, <var title="">y<sub title="">final</sub></var>) be the last point in the last subpath of <var title="">glyph
- subpaths</var>.</li>
+ <li id=mergeGlyphs>
- <li><p>Add all the subpaths in <var title="">glyph subpaths</var> to the <code><a href=#path>Path</a></code>
+ <p>Let <var title="">merged path</var> be a <a href=#concept-path title=concept-path>path</a> that
+ consists of a set of non-overlapping subpaths that exactly outline the points from which, in any
+ of the <a href=#concept-path title=concept-path>paths</a> in <var title="">glyph paths</var>, the number
+ of times a half-infinite straight line drawn from that point crosses that path is even.</p>
+
+ <p>The subpaths in <var title="">merged path</var> must be oriented such that for any point in
+ the path, the number of times a half-infinite straight line drawn from that point crosses a
+ subpath is even if and only if number of times a half-infinite straight line drawn from that
+ same point crosses a subpath going in one direction is equal to the number of times it crosses a
+ subpath going in the other direction.</p>
+
+ <div class=example>
+
+ <p>For example, suppose <var title="">text</var> consists of two overlapping glyphs "Q" and
+ "p" (maybe the "Q" has a flourish that crosses into the tail of the "p"). The <var title="">glyph paths</var> therefore consist of two paths, each with two subpaths: one for the
+ outside of the letter shape, and one for the inside of the letter shape. There are points that,
+ according to the even-odd fill rule, are filled in both shapes simultaneously: where they
+ overlap. As such, the subpaths from the two glyphs actually cross each other.</p>
+
+ <p><img src=http://images.whatwg.org/Qp-overlap.png alt=""></p> <!-- this image repeats the previous paragraph,
+ so alternative text would be redundant -->
+ <!--
+ c.clearRect(0, 0, 640, 480);
+ c.save();
+ try {
+ c.font = '100px Zapfino';
+ c.fillStyle = 'blue';
+ c.fillText('Q', 200, 200);
+ c.fillStyle = 'fuchsia';
+ c.fillText('p', 337, 200);
+ } finally {
+ c.restore();
+ }
+ -->
+
+ <p>The resulting <var title="">merged path</var> in such a situation would have just one path
+ for these two letters, with a total of just three subpaths (one big outer outline, one for the
+ inside of the "Q", and one for inside of the "p"). This single path would have no subpaths that
+ cross each other.</p>
+
+ <p><img src=http://images.whatwg.org/Qp-overlap-outline.png alt=""></p> <!-- this image again repeats the
+ previous paragraph, so alternative text would be redundant -->
+ <!-- this is just an edge-detected version of the previous image -->
+
+ </div>
+
+ </li>
+
+<!--CLEANUP-->
+ <li><p>Let (<var title="">x<sub title="">final</sub></var>, <var title="">y<sub title="">final</sub></var>) be the last point in the last subpath of <var title="">merged path</var>.</li>
+
+ <li><p>Add all the subpaths in <var title="">merged path</var> to the <code><a href=#path>Path</a></code>
object.</li>
+<!--CLEANUP-->
<li><p>Create a new subpath in the <code><a href=#path>Path</a></code> object with (<var title="">x<sub title="">final</sub></var>, <var title="">y<sub title="">final</sub></var>) as the only point in
the subpath.</li>
@@ -56797,6 +56850,8 @@
<li><p>Move all the shapes in <var title="">glyphs</var> to the right by <var title="">offset</var> CSS pixels.</li>
+ <li><p>Let <var title="">transformed path list</var> be an empty list of paths.</li>
+
<li>
<p>For each glyph <var title="">glyph</var> in the <var title="">glyphs</var> array, run these
@@ -56839,14 +56894,37 @@
<li><p>If the method is <code title=dom-path-addPathByStrokingText><a href=#dom-path-addpathbystrokingtext>addPathByStrokingText()</a></code>, replace <var title="">glyph subpaths</var> by the result of <a href=#trace-a-path title="trace a path">tracing</a> <var title="">glyph subpaths</var>, using the <code><a href=#canvasdrawingstyles>CanvasDrawingStyles</a></code> object argument for
the line styles.</p>
- <li><p>Let (<var title="">x<sub title="">final</sub></var>, <var title="">y<sub title="">final</sub></var>) be the last point in the last subpath of <var title="">glyph
- subpaths</var>. (This coordinate is only used if this is the last glyph processed.)</li>
+ <li><p>Add all the subpaths in <var title="">glyph subpaths</var> to <var title="">transformed path list</var>.</li>
- <li><p>Add all the subpaths in <var title="">glyph subpaths</var> to <var title="">target</var>.</li>
-
</ol></li>
- <li><p>Create a new subpath in the <code><a href=#path>Path</a></code> object with (<var title="">x<sub title="">final</sub></var>, <var title="">y<sub title="">final</sub></var>) as the only point in
+ <li>
+
+ <p>Let <var title="">merged path</var> be a <a href=#concept-path title=concept-path>path</a> that
+ consists of a set of non-overlapping subpaths that exactly outline the points from which, in any
+ of the <a href=#concept-path title=concept-path>paths</a> in <var title="">transformed path list</var>,
+ the number of times a half-infinite straight line drawn from that point crosses that path is
+ even.</p>
+
+ <p>The subpaths in <var title="">merged path</var> must be oriented such that for any point in
+ the path, the number of times a half-infinite straight line drawn from that point crosses a
+ subpath is even if and only if number of times a half-infinite straight line drawn from that
+ same point crosses a subpath going in one direction is equal to the number of times it crosses a
+ subpath going in the other direction.</p>
+
+ <p class=note>See <a href=#mergeGlyphs>the equivalent step in the earlier algorithm</a> for
+ an example of this step. It's even more likely that there will be overlap with this method,
+ since neighboring glyphs are likely to be rotated relative to each other.</p>
+
+ </li>
+
+ <li><p>Let (<var title="">x<sub title="">final</sub></var>, <var title="">y<sub title="">final</sub></var>) be the last point in the last subpath of <var title="">merged
+ path</var>.</li>
+
+ <li><p>Add all the subpaths in <var title="">merged path</var> to <var title="">target</var>.</li>
+
+<!--CLEANUP-->
+ <li><p>Create a new subpath in <var title="">target</var> with (<var title="">x<sub title="">final</sub></var>, <var title="">y<sub title="">final</sub></var>) as the only point in
the subpath.</li>
</ol></div>
Added: images/Qp-overlap-outline.png
===================================================================
(Binary files differ)
Property changes on: images/Qp-overlap-outline.png
___________________________________________________________________
Added: svn:mime-type
+ application/octet-stream
Added: images/Qp-overlap.png
===================================================================
(Binary files differ)
Property changes on: images/Qp-overlap.png
___________________________________________________________________
Added: svn:mime-type
+ application/octet-stream
Modified: index
===================================================================
--- index 2014-03-10 21:00:43 UTC (rev 8537)
+++ index 2014-03-12 22:01:04 UTC (rev 8538)
@@ -298,7 +298,7 @@
<header class=head id=head><p><a href=http://www.whatwg.org/ class=logo><img width=101 src=/images/logo alt=WHATWG height=101></a></p>
<hgroup><h1 class=allcaps>HTML</h1>
- <h2 class="no-num no-toc">Living Standard — Last Updated 10 March 2014</h2>
+ <h2 class="no-num no-toc">Living Standard — Last Updated 12 March 2014</h2>
</hgroup><dl><dt><strong>Web developer edition:</strong></dt>
<dd><strong><a href=http://developers.whatwg.org/>http://developers.whatwg.org/</a></strong></dd>
<dt>Multiple-page version:</dt>
@@ -56740,23 +56740,76 @@
<li><p>Move all the shapes in <var title="">glyphs</var> to the right by <var title="">x</var>
CSS pixels and down by <var title="">y</var> CSS pixels.</li>
- <li><p>Let <var title="">glyph subpaths</var> be a <a href=#concept-path title=concept-path>path</a> describing the shapes given
- in <var title="">glyphs</var>, with each CSS pixel in the coordinate space of <var title="">glyphs</var> mapped to one coordinate space unit in <var title="">glyph subpaths</var>.
- Subpaths in <var title="">glyph subpaths</var> must wind clockwise, regardless of how the user
+<!--CLEANUP-->
+ <li><p>Let <var title="">glyph paths</var> be a list of <a href=#concept-path title=concept-path>paths</a> describing the shapes given
+ in <var title="">glyphs</var>, with each CSS pixel in the coordinate space of <var title="">glyphs</var> mapped to one coordinate space unit in <var title="">glyph paths</var>.
+ Subpaths in <var title="">glyph paths</var> must wind clockwise, regardless of how the user
agent's font subsystem renders fonts and regardless of how the fonts themselves are defined.</p>
- <li><p>Transform all the coordinates and lines in <var title="">glyph subpaths</var> by the
+ <li><p>Transform all the coordinates and lines in <var title="">glyph paths</var> by the
transformation matrix <var title="">transform</var>, if it is not null.</li>
- <li><p>If the method is <code title=dom-path-addPathByStrokingText><a href=#dom-path-addpathbystrokingtext>addPathByStrokingText()</a></code>, replace <var title="">glyph subpaths</var> by the result of <a href=#trace-a-path title="trace a path">tracing</a> <var title="">glyph subpaths</var>, using the <code><a href=#canvasdrawingstyles>CanvasDrawingStyles</a></code> object argument for the
+<!--CLEANUP-->
+ <li><p>If the method is <code title=dom-path-addPathByStrokingText><a href=#dom-path-addpathbystrokingtext>addPathByStrokingText()</a></code>, replace <var title="">glyph paths</var> by the result of <a href=#trace-a-path title="trace a path">tracing</a> each <a href=#concept-path title=concept-path>path</a> in <var title="">glyph paths</var>, using the <code><a href=#canvasdrawingstyles>CanvasDrawingStyles</a></code> object argument for the
line styles.</p>
- <li><p>Let (<var title="">x<sub title="">final</sub></var>, <var title="">y<sub title="">final</sub></var>) be the last point in the last subpath of <var title="">glyph
- subpaths</var>.</li>
+ <li id=mergeGlyphs>
- <li><p>Add all the subpaths in <var title="">glyph subpaths</var> to the <code><a href=#path>Path</a></code>
+ <p>Let <var title="">merged path</var> be a <a href=#concept-path title=concept-path>path</a> that
+ consists of a set of non-overlapping subpaths that exactly outline the points from which, in any
+ of the <a href=#concept-path title=concept-path>paths</a> in <var title="">glyph paths</var>, the number
+ of times a half-infinite straight line drawn from that point crosses that path is even.</p>
+
+ <p>The subpaths in <var title="">merged path</var> must be oriented such that for any point in
+ the path, the number of times a half-infinite straight line drawn from that point crosses a
+ subpath is even if and only if number of times a half-infinite straight line drawn from that
+ same point crosses a subpath going in one direction is equal to the number of times it crosses a
+ subpath going in the other direction.</p>
+
+ <div class=example>
+
+ <p>For example, suppose <var title="">text</var> consists of two overlapping glyphs "Q" and
+ "p" (maybe the "Q" has a flourish that crosses into the tail of the "p"). The <var title="">glyph paths</var> therefore consist of two paths, each with two subpaths: one for the
+ outside of the letter shape, and one for the inside of the letter shape. There are points that,
+ according to the even-odd fill rule, are filled in both shapes simultaneously: where they
+ overlap. As such, the subpaths from the two glyphs actually cross each other.</p>
+
+ <p><img src=http://images.whatwg.org/Qp-overlap.png alt=""></p> <!-- this image repeats the previous paragraph,
+ so alternative text would be redundant -->
+ <!--
+ c.clearRect(0, 0, 640, 480);
+ c.save();
+ try {
+ c.font = '100px Zapfino';
+ c.fillStyle = 'blue';
+ c.fillText('Q', 200, 200);
+ c.fillStyle = 'fuchsia';
+ c.fillText('p', 337, 200);
+ } finally {
+ c.restore();
+ }
+ -->
+
+ <p>The resulting <var title="">merged path</var> in such a situation would have just one path
+ for these two letters, with a total of just three subpaths (one big outer outline, one for the
+ inside of the "Q", and one for inside of the "p"). This single path would have no subpaths that
+ cross each other.</p>
+
+ <p><img src=http://images.whatwg.org/Qp-overlap-outline.png alt=""></p> <!-- this image again repeats the
+ previous paragraph, so alternative text would be redundant -->
+ <!-- this is just an edge-detected version of the previous image -->
+
+ </div>
+
+ </li>
+
+<!--CLEANUP-->
+ <li><p>Let (<var title="">x<sub title="">final</sub></var>, <var title="">y<sub title="">final</sub></var>) be the last point in the last subpath of <var title="">merged path</var>.</li>
+
+ <li><p>Add all the subpaths in <var title="">merged path</var> to the <code><a href=#path>Path</a></code>
object.</li>
+<!--CLEANUP-->
<li><p>Create a new subpath in the <code><a href=#path>Path</a></code> object with (<var title="">x<sub title="">final</sub></var>, <var title="">y<sub title="">final</sub></var>) as the only point in
the subpath.</li>
@@ -56797,6 +56850,8 @@
<li><p>Move all the shapes in <var title="">glyphs</var> to the right by <var title="">offset</var> CSS pixels.</li>
+ <li><p>Let <var title="">transformed path list</var> be an empty list of paths.</li>
+
<li>
<p>For each glyph <var title="">glyph</var> in the <var title="">glyphs</var> array, run these
@@ -56839,14 +56894,37 @@
<li><p>If the method is <code title=dom-path-addPathByStrokingText><a href=#dom-path-addpathbystrokingtext>addPathByStrokingText()</a></code>, replace <var title="">glyph subpaths</var> by the result of <a href=#trace-a-path title="trace a path">tracing</a> <var title="">glyph subpaths</var>, using the <code><a href=#canvasdrawingstyles>CanvasDrawingStyles</a></code> object argument for
the line styles.</p>
- <li><p>Let (<var title="">x<sub title="">final</sub></var>, <var title="">y<sub title="">final</sub></var>) be the last point in the last subpath of <var title="">glyph
- subpaths</var>. (This coordinate is only used if this is the last glyph processed.)</li>
+ <li><p>Add all the subpaths in <var title="">glyph subpaths</var> to <var title="">transformed path list</var>.</li>
- <li><p>Add all the subpaths in <var title="">glyph subpaths</var> to <var title="">target</var>.</li>
-
</ol></li>
- <li><p>Create a new subpath in the <code><a href=#path>Path</a></code> object with (<var title="">x<sub title="">final</sub></var>, <var title="">y<sub title="">final</sub></var>) as the only point in
+ <li>
+
+ <p>Let <var title="">merged path</var> be a <a href=#concept-path title=concept-path>path</a> that
+ consists of a set of non-overlapping subpaths that exactly outline the points from which, in any
+ of the <a href=#concept-path title=concept-path>paths</a> in <var title="">transformed path list</var>,
+ the number of times a half-infinite straight line drawn from that point crosses that path is
+ even.</p>
+
+ <p>The subpaths in <var title="">merged path</var> must be oriented such that for any point in
+ the path, the number of times a half-infinite straight line drawn from that point crosses a
+ subpath is even if and only if number of times a half-infinite straight line drawn from that
+ same point crosses a subpath going in one direction is equal to the number of times it crosses a
+ subpath going in the other direction.</p>
+
+ <p class=note>See <a href=#mergeGlyphs>the equivalent step in the earlier algorithm</a> for
+ an example of this step. It's even more likely that there will be overlap with this method,
+ since neighboring glyphs are likely to be rotated relative to each other.</p>
+
+ </li>
+
+ <li><p>Let (<var title="">x<sub title="">final</sub></var>, <var title="">y<sub title="">final</sub></var>) be the last point in the last subpath of <var title="">merged
+ path</var>.</li>
+
+ <li><p>Add all the subpaths in <var title="">merged path</var> to <var title="">target</var>.</li>
+
+<!--CLEANUP-->
+ <li><p>Create a new subpath in <var title="">target</var> with (<var title="">x<sub title="">final</sub></var>, <var title="">y<sub title="">final</sub></var>) as the only point in
the subpath.</li>
</ol></div>
Modified: source
===================================================================
--- source 2014-03-10 21:00:43 UTC (rev 8537)
+++ source 2014-03-12 22:01:04 UTC (rev 8538)
@@ -62984,28 +62984,82 @@
<li><p>Move all the shapes in <var data-x="">glyphs</var> to the right by <var data-x="">x</var>
CSS pixels and down by <var data-x="">y</var> CSS pixels.</p></li>
- <li><p>Let <var data-x="">glyph subpaths</var> be a <span data-x="concept-path">path</span> describing the shapes given
+<!--CLEANUP-->
+ <li><p>Let <var data-x="">glyph paths</var> be a list of <span data-x="concept-path">paths</span> describing the shapes given
in <var data-x="">glyphs</var>, with each CSS pixel in the coordinate space of <var
- data-x="">glyphs</var> mapped to one coordinate space unit in <var data-x="">glyph subpaths</var>.
- Subpaths in <var data-x="">glyph subpaths</var> must wind clockwise, regardless of how the user
+ data-x="">glyphs</var> mapped to one coordinate space unit in <var data-x="">glyph paths</var>.
+ Subpaths in <var data-x="">glyph paths</var> must wind clockwise, regardless of how the user
agent's font subsystem renders fonts and regardless of how the fonts themselves are defined.</p>
- <li><p>Transform all the coordinates and lines in <var data-x="">glyph subpaths</var> by the
+ <li><p>Transform all the coordinates and lines in <var data-x="">glyph paths</var> by the
transformation matrix <var data-x="">transform</var>, if it is not null.</p></li>
+<!--CLEANUP-->
<li><p>If the method is <code
data-x="dom-path-addPathByStrokingText">addPathByStrokingText()</code>, replace <var
- data-x="">glyph subpaths</var> by the result of <span data-x="trace a path">tracing</span> <var
- data-x="">glyph subpaths</var>, using the <code>CanvasDrawingStyles</code> object argument for the
+ data-x="">glyph paths</var> by the result of <span data-x="trace a path">tracing</span> each <span data-x="concept-path">path</span> in <var
+ data-x="">glyph paths</var>, using the <code>CanvasDrawingStyles</code> object argument for the
line styles.</p>
+ <li id="mergeGlyphs">
+
+ <p>Let <var data-x="">merged path</var> be a <span data-x="concept-path">path</span> that
+ consists of a set of non-overlapping subpaths that exactly outline the points from which, in any
+ of the <span data-x="concept-path">paths</span> in <var data-x="">glyph paths</var>, the number
+ of times a half-infinite straight line drawn from that point crosses that path is even.</p>
+
+ <p>The subpaths in <var data-x="">merged path</var> must be oriented such that for any point in
+ the path, the number of times a half-infinite straight line drawn from that point crosses a
+ subpath is even if and only if number of times a half-infinite straight line drawn from that
+ same point crosses a subpath going in one direction is equal to the number of times it crosses a
+ subpath going in the other direction.</p>
+
+ <div class="example">
+
+ <p>For example, suppose <var data-x="">text</var> consists of two overlapping glyphs "Q" and
+ "p" (maybe the "Q" has a flourish that crosses into the tail of the "p"). The <var
+ data-x="">glyph paths</var> therefore consist of two paths, each with two subpaths: one for the
+ outside of the letter shape, and one for the inside of the letter shape. There are points that,
+ according to the even-odd fill rule, are filled in both shapes simultaneously: where they
+ overlap. As such, the subpaths from the two glyphs actually cross each other.</p>
+
+ <p><img src="images/Qp-overlap.png" alt=""></p> <!-- this image repeats the previous paragraph,
+ so alternative text would be redundant -->
+ <!--
+ c.clearRect(0, 0, 640, 480);
+ c.save();
+ try {
+ c.font = '100px Zapfino';
+ c.fillStyle = 'blue';
+ c.fillText('Q', 200, 200);
+ c.fillStyle = 'fuchsia';
+ c.fillText('p', 337, 200);
+ } finally {
+ c.restore();
+ }
+ -->
+
+ <p>The resulting <var data-x="">merged path</var> in such a situation would have just one path
+ for these two letters, with a total of just three subpaths (one big outer outline, one for the
+ inside of the "Q", and one for inside of the "p"). This single path would have no subpaths that
+ cross each other.</p>
+
+ <p><img src="images/Qp-overlap-outline.png" alt=""></p> <!-- this image again repeats the
+ previous paragraph, so alternative text would be redundant -->
+ <!-- this is just an edge-detected version of the previous image -->
+
+ </div>
+
+ </li>
+
+<!--CLEANUP-->
<li><p>Let (<var data-x="">x<sub data-x="">final</sub></var>, <var data-x="">y<sub
- data-x="">final</sub></var>) be the last point in the last subpath of <var data-x="">glyph
- subpaths</var>.</p></li>
+ data-x="">final</sub></var>) be the last point in the last subpath of <var data-x="">merged path</var>.</p></li>
- <li><p>Add all the subpaths in <var data-x="">glyph subpaths</var> to the <code>Path</code>
+ <li><p>Add all the subpaths in <var data-x="">merged path</var> to the <code>Path</code>
object.</p></li>
+<!--CLEANUP-->
<li><p>Create a new subpath in the <code>Path</code> object with (<var data-x="">x<sub
data-x="">final</sub></var>, <var data-x="">y<sub data-x="">final</sub></var>) as the only point in
the subpath.</p></li>
@@ -63062,6 +63116,8 @@
<li><p>Move all the shapes in <var data-x="">glyphs</var> to the right by <var
data-x="">offset</var> CSS pixels.</p></li>
+ <li><p>Let <var data-x="">transformed path list</var> be an empty list of paths.</p></li>
+
<li>
<p>For each glyph <var data-x="">glyph</var> in the <var data-x="">glyphs</var> array, run these
@@ -63115,18 +63171,42 @@
data-x="">glyph subpaths</var>, using the <code>CanvasDrawingStyles</code> object argument for
the line styles.</p>
- <li><p>Let (<var data-x="">x<sub data-x="">final</sub></var>, <var data-x="">y<sub
- data-x="">final</sub></var>) be the last point in the last subpath of <var data-x="">glyph
- subpaths</var>. (This coordinate is only used if this is the last glyph processed.)</p></li>
-
<li><p>Add all the subpaths in <var data-x="">glyph subpaths</var> to <var
- data-x="">target</var>.</p></li>
+ data-x="">transformed path list</var>.</p></li>
</ol>
</li>
- <li><p>Create a new subpath in the <code>Path</code> object with (<var data-x="">x<sub
+ <li>
+
+ <p>Let <var data-x="">merged path</var> be a <span data-x="concept-path">path</span> that
+ consists of a set of non-overlapping subpaths that exactly outline the points from which, in any
+ of the <span data-x="concept-path">paths</span> in <var data-x="">transformed path list</var>,
+ the number of times a half-infinite straight line drawn from that point crosses that path is
+ even.</p>
+
+ <p>The subpaths in <var data-x="">merged path</var> must be oriented such that for any point in
+ the path, the number of times a half-infinite straight line drawn from that point crosses a
+ subpath is even if and only if number of times a half-infinite straight line drawn from that
+ same point crosses a subpath going in one direction is equal to the number of times it crosses a
+ subpath going in the other direction.</p>
+
+ <p class="note">See <a href="#mergeGlyphs">the equivalent step in the earlier algorithm</a> for
+ an example of this step. It's even more likely that there will be overlap with this method,
+ since neighboring glyphs are likely to be rotated relative to each other.</p>
+
+ </li>
+
+ <li><p>Let (<var data-x="">x<sub data-x="">final</sub></var>, <var data-x="">y<sub
+ data-x="">final</sub></var>) be the last point in the last subpath of <var data-x="">merged
+ path</var>.</p></li>
+
+ <li><p>Add all the subpaths in <var data-x="">merged path</var> to <var
+ data-x="">target</var>.</p></li>
+
+<!--CLEANUP-->
+ <li><p>Create a new subpath in <var data-x="">target</var> with (<var data-x="">x<sub
data-x="">final</sub></var>, <var data-x="">y<sub data-x="">final</sub></var>) as the only point in
the subpath.</p></li>
More information about the Commit-Watchers
mailing list