Add the <hatch> and <hatchpath> elements.
--- a/master/changes.html Mon May 20 10:22:00 2013 +0200
+++ b/master/changes.html Tue May 21 20:10:29 2013 +0200
@@ -1,4 +1,4 @@
-<?xml version="1.0" encoding="utf-8"?>
+<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional+edit//EN" "xhtml1-transitional+edit.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:edit="http://xmlns.grorg.org/SVGT12NG/">
<head>
@@ -187,6 +187,8 @@
<li>Added a section for mesh gradients, defining the <a>'meshGradient'</a>, <a>'meshRow'</a>
and <a>'meshPatch'</a> elements.</li>
+
+ <li>Added a section for hatches, defining the <a>'hatch'</a> and <a>'hatchPath'</a> elements.</li>
</ul>
<h3 id="masking">Clipping, Masking and Compositing chapter</h3>
--- a/master/definitions.xml Mon May 20 10:22:00 2013 +0200
+++ b/master/definitions.xml Tue May 21 20:10:29 2013 +0200
@@ -323,6 +323,35 @@
</element>
<element
+ name='hatch'
+ href='pservers.html#HatchElement'
+ contentmodel='anyof'
+ elementcategories='animation, descriptive'
+ elements='hatchPath'
+ attributecategories='core, presentation, style, xlink'
+ interfaces='SVGHatchElement'>
+ <attribute name='x' href='pservers.html#HatchElementXAttribute' animatable='yes'/>
+ <attribute name='y' href='pservers.html#HatchElementYAttribute' animatable='yes'/>
+ <attribute name='pitch' href='pservers.html#HatchElementPitchAttribute' animatable='yes'/>
+ <attribute name='angle' href='pservers.html#HatchElementAngleAttribute' animatable='yes'/>
+ <attribute name='hatchUnits' href='pservers.html#HatchElementHatchUnitsAttribute' animatable='yes'/>
+ <attribute name='hatchContentUnits' href='pservers.html#HatchElementHatchContentUnitsAttribute' animatable='yes'/>
+ <attribute name='hatchTransform' href='pservers.html#HatchElementHatchTransformAttribute' animatable='yes'/>
+ <attribute name='xlink:href' href='pservers.html#HatchElementHrefAttribute' animatable='yes'/>
+ </element>
+
+ <element
+ name='hatchPath'
+ href='pservers.html#HatchPathElement'
+ contentmodel='anyof'
+ elementcategories='animation, descriptive'
+ attributecategories='core, presentation, style'
+ interfaces='SVGHatchPathElement'>
+ <attribute name='d' href='paths.html#DAttribute' animatable='yes'/>
+ <attribute name='offset' href='pservers.html#HatchPathElementOffsetAttribute' animatable='yes'/>
+ </element>
+
+ <element
name='hkern'
href='fonts.html#HKernElement'
attributecategories='aria, navigation, core'
@@ -747,7 +776,7 @@
<elementcategory name='graphics referencing' href='intro.html#TermGraphicsReferencingElement' elements='use, image'/>
<elementcategory name='light source' href='intro.html#TermLightSourceElement' elements='feDistantLight, fePointLight, feSpotLight'/>
<elementcategory name='markable' href='intro.html#TermMarkableElement' elements='path, line, polyline, polygon'/>
- <elementcategory name='paint server' href='intro.html#TermPaintServerElement' elements='solidColor, linearGradient, radialGradient, meshGradient, pattern'/>
+ <elementcategory name='paint server' href='intro.html#TermPaintServerElement' elements='solidColor, linearGradient, radialGradient, meshGradient, pattern, hatch'/>
<elementcategory name='shape' href='intro.html#TermShapeElement' elements='circle, ellipse, line, path, polygon, polyline, rect'/>
<elementcategory name='structural' href='intro.html#TermStructuralElement' elements='defs, g, svg, symbol, use'/>
<elementcategory name='text content' href='intro.html#TermTextContentElement' elements='text, tspan, tref, textPath, altGlyph'/>
@@ -791,8 +820,8 @@
<!-- <attribute name='width' elements='text' href='text.html#TextElementWidthAttribute' animatable='yes'/> -->
<!-- xlink:show and xlink:actuate for all elements supporting the XLink attributes, except a -->
- <attribute name='xlink:show' elements='animate, set, animateMotion, mpath, animateColor, animateTransform, color-profile, filter, feImage, font-face-uri, cursor, pattern, script, textPath, tref, use, image, altGlyph, glyphRef, linearGradient, radialGradient, meshGradient' href='linking.html#XLinkShowAttribute'/>
- <attribute name='xlink:actuate' elements='animate, set, animateMotion, mpath, animateColor, animateTransform, color-profile, filter, feImage, font-face-uri, cursor, pattern, script, textPath, tref, use, image, altGlyph, glyphRef, linearGradient, radialGradient, meshGradient' href='linking.html#XLinkActuateAttribute'/>
+ <attribute name='xlink:show' elements='animate, set, animateMotion, mpath, animateColor, animateTransform, color-profile, filter, feImage, font-face-uri, cursor, pattern, hatch, script, textPath, tref, use, image, altGlyph, glyphRef, linearGradient, radialGradient, meshGradient' href='linking.html#XLinkShowAttribute'/>
+ <attribute name='xlink:actuate' elements='animate, set, animateMotion, mpath, animateColor, animateTransform, color-profile, filter, feImage, font-face-uri, cursor, pattern, hatch, script, textPath, tref, use, image, altGlyph, glyphRef, linearGradient, radialGradient, meshGradient' href='linking.html#XLinkActuateAttribute'/>
<!-- attribute common to all animation elements -->
<attribute name='xlink:href' elements='animate, animateColor, animateMotion, animateTransform, set' href='animate.html#HrefAttribute'/>
@@ -1140,6 +1169,8 @@
<interface name='SVGMeshPatchElement' href='pservers.html#InterfaceSVGMeshPatchElement'/>
<interface name='SVGStopElement' href='pservers.html#InterfaceSVGStopElement'/>
<interface name='SVGPatternElement' href='pservers.html#InterfaceSVGPatternElement'/>
+ <interface name='SVGHatchElement' href='pservers.html#InterfaceSVGHatchElement'/>
+ <interface name='SVGHatchPathElement' href='pservers.html#InterfaceSVGHatchPathElement'/>
<interface name='SVGCursorElement' href='interact.html#InterfaceSVGCursorElement'/>
<interface name='SVGAElement' href='linking.html#InterfaceSVGAElement'/>
<interface name='SVGViewElement' href='linking.html#InterfaceSVGViewElement'/>
Binary file master/images/pservers/hatch01.png has changed
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/master/images/pservers/hatch01.svg Tue May 21 20:10:29 2013 +0200
@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:xlink="http://www.w3.org/1999/xlink"
+ width="200"
+ height="200">
+ <defs>
+ <pattern
+ id="pattern"
+ patternUnits="userSpaceOnUse"
+ patternTransform="matrix(0.70710678,-0.70710678,0.70710678,0.70710678,200,200)"
+ width="5"
+ height="250">
+ <path
+ d="M 0,0 0,250"
+ stroke="#a080ff"
+ stroke-width="2"/>
+ </pattern>
+ </defs>
+ <rect
+ fill="url(#pattern)"
+ stroke="black"
+ stroke-width="2"
+ x="25"
+ y="25"
+ width="150"
+ height="150" />
+</svg>
Binary file master/images/pservers/hatch02.png has changed
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/master/images/pservers/hatch02.svg Tue May 21 20:10:29 2013 +0200
@@ -0,0 +1,38 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:xlink="http://www.w3.org/1999/xlink"
+ width="200"
+ height="200">
+ <defs>
+ <pattern
+ id="pattern"
+ patternUnits="userSpaceOnUse"
+ width="6"
+ height="20">
+ <path
+ d="M -6,0 C -6,4 2,6 2,10 2,14 -6,16 -6,20"
+ fill="none"
+ stroke="#a080ff"
+ stroke-width="1"/>
+ <path
+ d="M 0,0 C 0,4 8,6 8,10 8,14 0,16 0,20"
+ fill="none"
+ stroke="#a080ff"
+ stroke-width="1"/>
+ <path
+ d="M 6,0 C 6,4 14,6 14,10 14,14 6,16 6,20"
+ fill="none"
+ stroke="#a080ff"
+ stroke-width="1"/>
+ </pattern>
+ </defs>
+ <rect
+ fill="url(#pattern)"
+ stroke="black"
+ stroke-width="2"
+ x="25"
+ y="25"
+ width="150"
+ height="150" />
+</svg>
Binary file master/images/pservers/hatch03.png has changed
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/master/images/pservers/hatch03.svg Tue May 21 20:10:29 2013 +0200
@@ -0,0 +1,35 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:xlink="http://www.w3.org/1999/xlink"
+ width="200"
+ height="200">
+ <defs>
+ <pattern
+ id="pattern"
+ patternUnits="userSpaceOnUse"
+ width="20"
+ height="50">
+ <g transform="translate(0,-1)">
+ <path
+ d="M 0,-50 10,-50 0,0 10,50 0,50 10,100"
+ fill="none"
+ stroke="#a080ff"
+ stroke-width="2"/>
+ <path
+ d="M 20,-50 30,-50 20,0 30,50 20,50 30,100"
+ fill="none"
+ stroke="#a080ff"
+ stroke-width="2"/>
+ </g>
+ </pattern>
+ </defs>
+ <rect
+ fill="url(#pattern)"
+ stroke="black"
+ stroke-width="2"
+ x="25"
+ y="25"
+ width="150"
+ height="150" />
+</svg>
Binary file master/images/pservers/hatch04.png has changed
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/master/images/pservers/hatch04.svg Tue May 21 20:10:29 2013 +0200
@@ -0,0 +1,35 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:xlink="http://www.w3.org/1999/xlink"
+ width="200"
+ height="200">
+ <defs>
+ <pattern
+ id="pattern"
+ patternUnits="userSpaceOnUse"
+ width="20"
+ height="50">
+ <g transform="translate(0,-1)">
+ <path
+ d="M 0,0 10,50 M 0,50 10,100"
+ fill="none"
+ stroke="#a080ff"
+ stroke-width="2"/>
+ <path
+ d="M 20,0 30,50 M 20,50 30,100"
+ fill="none"
+ stroke="#a080ff"
+ stroke-width="2"/>
+ </g>
+ </pattern>
+ </defs>
+ <rect
+ fill="url(#pattern)"
+ stroke="black"
+ stroke-width="2"
+ x="25"
+ y="25"
+ width="150"
+ height="150" />
+</svg>
Binary file master/images/pservers/hatch05.png has changed
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/master/images/pservers/hatch05.svg Tue May 21 20:10:29 2013 +0200
@@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:xlink="http://www.w3.org/1999/xlink"
+ width="200"
+ height="200">
+ <defs>
+ <pattern
+ id="pattern"
+ patternUnits="userSpaceOnUse"
+ width="20"
+ height="20">
+ <path
+ d="M 0,0 0,50"
+ fill="none"
+ stroke="#a080ff"
+ stroke-width="2"/>
+ <path
+ d="M 20,0 20,50"
+ fill="none"
+ stroke="#a080ff"
+ stroke-width="2"/>
+ <path
+ d="M 5,0 5,50"
+ fill="none"
+ stroke="#a080ff"
+ stroke-width="2"
+ stroke-dasharray="10 4 2 4"/>
+ </pattern>
+ </defs>
+ <rect
+ fill="url(#pattern)"
+ stroke="black"
+ stroke-width="2"
+ x="25"
+ y="25"
+ width="150"
+ height="150" />
+</svg>
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/master/images/pservers/hatch_attributes.svg Tue May 21 20:10:29 2013 +0200
@@ -0,0 +1,57 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+ xmlns="http://www.w3.org/2000/svg"
+ width="450"
+ height="300">
+ <defs>
+ <marker
+ id="Arrow2Mstart"
+ orient="auto"
+ refY="0.0"
+ refX="0.0"
+ style="overflow:visible">
+ <path
+ d="M 8.7,4 L -2.2,0 L 8.7,-4 C 7,-1.6 7,1.6 8.7,4 z "
+ transform="scale(0.6)"/>
+ </marker>
+ <marker
+ id="Arrow2Mend"
+ orient="auto"
+ refY="0.0"
+ refX="0.0"
+ style="overflow:visible;">
+ <path
+ d="M 8.7,4 L -2.2,0 L 8.7,-4 C 7,-1.6 7,1.6 8.7,4 z "
+ transform="scale(0.6) rotate(180)"/>
+ </marker>
+ </defs>
+ <path
+ style="fill:none;stroke:black"
+ d="M 125,50 325,250"/>
+ <g style="fill:none;stroke:black;stroke-width:2;stroke-dasharray:3, 1">
+ <path d="M 250,275 400,125" style="opacity:0.5"/>
+ <path d="M 175,250 350,75"/>
+ <path d="M 100,225 275,50"/>
+ <path d="M 50,175 200,25" style="opacity:0.5"/>
+ </g>
+ <path
+ style="fill:none;stroke:black;stroke-width:2;marker-end:url(#Arrow2Mend)"
+ d="m 200,125 50,50"/>
+ <circle cx="200" cy="125" r="3"/>
+ <path
+ style="fill:none;stroke:black"
+ d="m 200,125 35,0"/>
+ <path
+ style="fill:none;stroke:black;stroke-width:1.5;marker-start:url(#Arrow2Mstart)"
+ d="M 222.3,145 A 30,30 0 0 0 230,125" />
+ <g style="font-size:16px;text-anchor:middle;font-family:DejaVu Sans">
+ <text x="170" y="130">(x,y)</text>
+ <text x="253" y="143">Angle</text>
+ <text x="265" y="-35"
+ transform="matrix(0.70710678,0.70710678,-0.70710678,0.70710678,0,0)">Pitch</text>
+ <text>
+ <tspan x="365" y="245">Reference</tspan>
+ <tspan x="365" y="262.5">line</tspan>
+ </text>
+ </g>
+</svg>
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/master/images/pservers/hatch_path_attributes.svg Tue May 21 20:10:29 2013 +0200
@@ -0,0 +1,60 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+ xmlns="http://www.w3.org/2000/svg"
+ width="450"
+ height="300">
+ <defs>
+ <marker
+ id="Arrow2Mstart"
+ orient="auto"
+ refY="0.0"
+ refX="0.0"
+ style="overflow:visible">
+ <path
+ d="M 8.7,4 L -2.2,0 L 8.7,-4 C 7,-1.6 7,1.6 8.7,4 z "
+ transform="scale(0.6)"/>
+ </marker>
+ <marker
+ id="Arrow2Mend"
+ orient="auto"
+ refY="0.0"
+ refX="0.0"
+ style="overflow:visible;">
+ <path
+ d="M 8.7,4 L -2.2,0 L 8.7,-4 C 7,-1.6 7,1.6 8.7,4 z "
+ transform="scale(0.6) rotate(180)"/>
+ </marker>
+ </defs>
+ <path
+ style="fill:none;stroke:black"
+ d="m 85,100 330,0"/>
+ <g style="fill:none;stroke:black;stroke-width:1;stroke-dasharray:3, 1">
+ <path d="M 100,250 100,50" style="opacity:0.5"/>
+ <path d="M 200,250 200,50"/>
+ <path d="M 300,250 300,50"/>
+ <path d="M 400,250 400,50" style="opacity:0.5"/>
+ </g>
+ <path
+ style="fill:none;stroke:black;stroke-width:2;marker-end:url(#Arrow2Mend)"
+ d="m 200,100 75,0"/>
+ <path
+ style="fill:none;stroke:black;stroke-width:2;marker-end:url(#Arrow2Mend)"
+ d="m 200,100 0,75"/>
+ <circle cx="200" cy="100" r="3"/>
+ <path
+ style="fill:none;stroke:black;stroke-width:1.5;marker-end:url(#Arrow2Mend)"
+ d="m 224,240 -21,0"/>
+ <path
+ style="fill:none;stroke:black;stroke-width:1.5;marker-end:url(#Arrow2Mend)"
+ d="m 276,240 21,0"/>
+ <g style="font-size:16px;text-anchor:middle;font-family:DejaVu Sans">
+ <text x="175" y="92">(0,0)</text>
+ <text x="255" y="92">x</text>
+ <text x="190" y="155">y</text>
+ <text x="250" y="245">Pitch</text>
+ <text>
+ <tspan x="53" y="95">Reference</tspan>
+ <tspan x="53" y="112.5">line</tspan>
+ </text>
+ </g>
+</svg>
--- a/master/pservers.html Mon May 20 10:22:00 2013 +0200
+++ b/master/pservers.html Tue May 21 20:10:29 2013 +0200
@@ -2,7 +2,7 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional+edit//EN" "xhtml1-transitional+edit.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:edit="http://xmlns.grorg.org/SVGT12NG/">
<head>
- <title>Paint Servers: Solid Colors, Gradients, and Patterns</title>
+ <title>Paint Servers: Solid Colors, Gradients, Patterns, and Hatches</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<link rel="stylesheet" title="Default" type="text/css" media="screen" href="style/default_svg.css"/>
<link rel="alternate stylesheet" title="No issues/annotations" type="text/css" media="screen" href="style/default_no_issues.css"/>
@@ -14,7 +14,7 @@
</head>
<body>
-<h1>Paint Servers: Solid Colors, Gradients, and Patterns</h1>
+<h1>Paint Servers: Solid Colors, Gradients, Patterns, and Hatches</h1>
<h2 id="Introduction">Introduction</h2>
@@ -31,13 +31,14 @@
redefine them here. -->
<p>
- SVG defines three types of paint servers:
+ SVG defines several types of paint servers:
</p>
<ul>
<li><a href="#SolidColors">Solid colors</a>,</li>
<li><a href="#Gradients">Gradients</a>,</li>
<li><a href="#Patterns">Patterns</a>.</li>
+ <li><a href="#Hatches">Hatches</a>.</li>
</ul>
<p class="issue">
@@ -50,27 +51,6 @@
<table>
<tr>
<th>SVG 2 Requirement:</th>
- <td>Support hatching.</td>
- </tr>
- <tr>
- <th>Resolution:</th>
- <td><a href="http://www.w3.org/2011/10/28-svg-irc#T18-28-09">SVG 2 should support hatching without the artifacts that patterns currently impose.</a></td>
- </tr>
- <tr>
- <th>Purpose:</th>
- <td>To allow the kinds of patterns required for mapping, engraving, etc. where continuous lines are required.</td>
- </tr>
- <tr>
- <th>Owner:</th>
- <td>Tav (no action)</td>
- </tr>
- </table>
-</div>
-
-<div class="annotation svg2-requirement">
- <table>
- <tr>
- <th>SVG 2 Requirement:</th>
<td>Arbitrary fills for shapes.</td>
</tr>
<tr>
@@ -88,14 +68,6 @@
</table>
</div>
-<p class="issue">
- It seems that all paint servers (except perhaps, mesh gradients,
- when rendered directly) inherit from their ancestors and do not
- inherit from the element referencing the paint server. Rather than
- repeating this for each type of paint server, can the text be moved
- into the introduction section for paint servers?
-</p>
-
<div class="figure">
<img
alt="Image of three types of paint servers."
@@ -112,6 +84,26 @@
a <a>'fill'</a> or <a>'stroke'</a> property (i.e. fill="#MyLightPurple").
</p>
+<p>
+ <a href="styling.html#SVGStylingProperties">Properties</a> inherit
+ into a paintserver element from its ancestors;
+ properties do <em>not</em> inherit from the element referencing
+ the paintserver element.
+</p>
+
+<p>
+ Paintserver elements are never rendered directly (with the exception
+ of <a>'meshGradient'</a> which may be rendered in a non-paintserver
+ mode); their only usage is as something that can be referenced using
+ the <a>'fill'</a> and <a>'stroke'</a> properties. The
+ <a>'display'</a> property does not apply to a paintserver element;
+ thus, paintserver elements are not directly rendered even if
+ the <a>'display'</a> property is set to a value other
+ than <span class="prop-value">none</span>, and paintserver elements
+ are available for referencing even when the <a>'display'</a>
+ property on the paintserver element or any of its ancestors is set
+ to <span class="prop-value">none</span>.
+</p>
<h2 id="SolidColors">Solid colors</h2>
@@ -146,22 +138,6 @@
<a href="color.html">Color</a> for a more general discussion of color
in SVG.)</p>
-<p><a href="styling.html#SVGStylingProperties">Properties</a> inherit
-into the <a>'solidColor'</a> element from its ancestors;
-properties do <em>not</em> inherit from the element referencing
-the <a>'solidColor'</a> element.</p>
-
-<p><a>'solidColor'</a> elements are never rendered directly;
-their only usage is as something that can be referenced using the
-<a>'fill'</a> and <a>'stroke'</a> properties. The <a>'display'</a>
-property does not apply to the <a>'solidColor'</a> element; thus,
-<a>'solidColor'</a> elements are not directly rendered even if
-the <a>'display'</a> property is set to a value other than
-<span class="prop-value">none</span>, and <a>'solidColor'</a>
-elements are available for referencing even when the <a>'display'</a>
-property on the <a>'solidColor'</a> element or any of its ancestors
-is set to <span class="prop-value">none</span>.</p>
-
<edit:with element='solidColor'>
<p id="SolidColorElement">Solid colors are defined by a <a>'solidColor'</a>
@@ -577,22 +553,6 @@
single color using the color and opacity of the last
<a href="pservers.html#GradientStops">gradient stop</a>.</p>
-<p><a href="styling.html#SVGStylingProperties">Properties</a> inherit
-into the <a>'linearGradient'</a> element from its ancestors;
-properties do <em>not</em> inherit from the element referencing
-the <a>'linearGradient'</a> element.</p>
-
-<p><a>'linearGradient'</a> elements are never rendered directly;
-their only usage is as something that can be referenced using the
-<a>'fill'</a> and <a>'stroke'</a> properties. The <a>'display'</a>
-property does not apply to the <a>'linearGradient'</a> element; thus,
-<a>'linearGradient'</a> elements are not directly rendered even if
-the <a>'display'</a> property is set to a value other than
-<span class="prop-value">none</span>, and <a>'linearGradient'</a>
-elements are available for referencing even when the <a>'display'</a>
-property on the <a>'linearGradient'</a> element or any of its ancestors
-is set to <span class="prop-value">none</span>.</p>
-
<p id="ExampleLinGrad01"><span class="example-ref">Example lingrad01</span>
shows how to fill a rectangle by referencing a linear gradient paint server.</p>
@@ -1056,22 +1016,6 @@
<a href="http://www.w3.org/2012/09/19-svg-minutes.html#item01">Rigi
Kaltbad working group meeting</a>.</p>
-<p><a href="styling.html#SVGStylingProperties">Properties</a>
-inherit into the <a>'radialGradient'</a> element from its ancestors;
-properties do <em>not</em> inherit from the element referencing the
-<a>'radialGradient'</a> element.</p>
-
-<p><a>'radialGradient'</a> elements are never rendered directly;
-their only usage is as something that can be referenced using the
-<a>'fill'</a> and <a>'stroke'</a> properties. The <a>'display'</a>
-property does not apply to the <a>'radialGradient'</a> element; thus,
-<a>'radialGradient'</a> elements are not directly rendered even if
-the <a>'display'</a> property is set to a value other than
-<span class="prop-value">none</span>, and <a>'radialGradient'</a> elements
-are available for referencing even when the <a>'display'</a> property on
-the <a>'radialGradient'</a> element or any of its ancestors is set to
-<span class="prop-value">none</span>.</p>
-
<p id="ExampleRadGrad01"><span class="example-ref">Example radgrad01</span>
shows how to fill a rectangle by referencing a radial gradient paint
server.</p>
@@ -1123,14 +1067,22 @@
</pre>
</div>
-<p class="issue">MathML gets stripped out by build script.</p>
-
-<pre><![CDATA[
-<math xmlns="http://www.w3.org/1998/Math/MathML">
- <mrow>
- <msup><mi>S</mi></msup><mo>=</mo><mi>S</mi><msub>C</msub><mo>+</mo><mi>S</mi><msub>D</msub>
- </mrow>
-</math>]]></pre>
+<p class="issue">Finish converting to MATHML.</p>
+
+<div role="math" aria-describedby="math-meshpatch-equation">
+ <math xmlns="http://www.w3.org/1998/Math/MathML" display="block">
+ <mrow>
+ <mi>S</mi>
+ <mo>=</mo>
+ <msub><mi>S</mi><mi>C</mi></msub>
+ <mo>+</mo>
+ <msub><mi>S</mi><mi>D</mi></msub>
+ <mo>-</mo>
+ <msub><mi>S</mi><mi>B</mi></msub>
+ </mrow>
+ </math>
+ <pre id="math-meshpatch-equation">S = S_C + S_D - S_B_</pre>
+</div>
<p class="issue">Come up with better explanation of the mapping with diagram.
The subtraction term in the above formula ensures that the boundary conditions
@@ -1775,21 +1727,6 @@
pattern coordinate system due to attributes <a>'x'</a>, <a>'y'</a>,
<a>'width'</a>, <a>'height'</a> and <a>'patternUnits'</a>.</p>
-<p><a href="styling.html#SVGStylingProperties">Properties</a> inherit into the
-<a>'pattern'</a> element from its ancestors; properties do <em>not</em>
-inherit from the element referencing the <a>'pattern'</a> element.</p>
-
-<p><a>'pattern'</a> elements are never rendered directly; their only
-usage is as something that can be referenced using the <a>'fill'</a>
-and <a>'stroke'</a> properties. The <a>'display'</a> property does not
-apply to the <a>'pattern'</a> element; thus, <a>'pattern'</a> elements
-are not directly rendered even if the <a>'display'</a> property is set
-to a value other than
-<span class="prop-value">none</span>, and <a>'pattern'</a> elements are
-available for referencing even when the <a>'display'</a> property on the
-<a>'pattern'</a> element or any of its ancestors is set to
-<span class="prop-value">none</span>.</p>
-
<p><a href="script.html#EventAttributes">Event attributes</a> and
<a href="svgdom.html#EventListeners">event listeners</a> attached
to the contents of a <a>'pattern'</a> element are not processed;
@@ -1810,6 +1747,532 @@
</edit:with>
+<h2 id="Hatches">Hatches</h2>
+
+<edit:with element='hatch'>
+
+<p class="note">Hatches are new in SVG 2. They were added to allow the
+kinds of patterns required for mapping, engraving, etc. where continuous
+lines are needed.</p>
+
+<div class="annotation svg2-requirement">
+ <table>
+ <tr>
+ <th>SVG 2 Requirement:</th>
+ <td>Support hatches.</td>
+ </tr>
+ <tr>
+ <th>Resolution:</th>
+ <td><a href="http://www.w3.org/2011/10/28-svg-irc#T18-28-09">SVG 2 should support hatchings without the artifacts that patterns currently impose.</a></td>
+ </tr>
+ <tr>
+ <th>Purpose:</th>
+ <td>To allow the kinds of patterns required for mapping, engraving, etc. where continuous lines are required.</td>
+ </tr>
+ <tr>
+ <th>Owner:</th>
+ <td>Tav (no action)</td>
+ </tr>
+ </table>
+</div>
+
+<p id="HatchElement">A hatch is used to <a>'fill'</a> or <a>'stroke'</a>
+an object using one or more pre-defined paths that are repeated
+at fixed intervals in a specified direction to cover the
+areas to be painted. Hatches are defined using a <a>'hatch'</a>
+element and then referenced by properties <a>'fill'</a> and
+<a>'stroke'</a> on a given <a>graphics element</a> to indicate that the
+given element shall be filled or stroked with the hatch.
+Paths are defined by <a>'hatchPath'</a> elements.</p>
+
+<p>Attributes <a>'x'</a>, <a>'y'</a>, <a>'pitch'</a>, <a>'angle'</a>,
+and <a>'hatchUnits'</a> define an infinitely long reference strip
+on the infinite canvas. The strip has one edge at
+(<var>x</var>, <var>y</var>) and its other edge at a distance
+of <var>pitch</var> in the direction defined by <var>angle</var>.
+This one-dimension tiling theoretically extends a series of such
+strips in the direction of 'angle' to infinity (positive and
+negative), with strips starting at
+(<var>x</var> + m*<var>pitch</var>*cos(<var>angle</var>), <var>y</var> + m*<var>pitch</var>*sin(<var>angle</var>)
+for each possible integer value of <em>m</em>.</p>
+
+<div class="figure">
+ <img
+ alt="A diagram showing the layout of a series of strips."
+ src="images/pservers/hatch_attributes.svg"/>
+ <p class="caption">Three adjacent strips separated by dashed lines
+ showing their relationship to each other for a
+ given <var>pitch</var> and <var>angle</var>. The reference line
+ determines the origin of <a>'hatchPath'</a>s.
+ </p>
+</div>
+
+<p class="issue">Check that angle defined in same sense as other
+ angles is SVG (clockwise/counter-clockwise, etc.).</p>
+
+<edit:elementsummary name='hatch'/>
+
+<p class="issue">Review content model.</p>
+
+<h3 id="HatchElementAttributes">Attributes</h3>
+
+ <dl class="attrdef-list-svg2">
+
+ <dt id="HatchElementHatchUnitsAttribute"><span class="adef">hatchUnits</span></dt>
+ <dd>
+
+ <p>
+ Defines the coordinate system for attributes
+ <a>'x'</a>, <a>'y'</a>, <a>'pitch'</a> and <a>'angle'</a>.
+ </p>
+
+ <dl class="attrdef-svg2">
+
+ <dt>Value</dt> <dd>userSpaceOnUse | objectBoundingBox</dd>
+ <dt><a>Lacuna value</a></dt> <dd>objectBoundingBox</dd>
+ <dt><a>Animatable</a></dt> <dd>yes</dd>
+
+ </dl>
+
+ <dl class="attrdef-values">
+
+ <dt>userSpaceOnUse</dt>
+ <dd>
+ <p>
+ If <span class="attr-value">hatchUnits="userSpaceOnUse"</span>,
+
+ <a>'x'</a>, <a>'y'</a>, <a>'pitch'</a>, and <a>'angle'</a>
+
+ represent values in the coordinate system that results
+ from taking the current user coordinate system in place at
+ the time when the <a>'hatch'</a> element is referenced
+ (i.e., the user coordinate system for the element
+ referencing the <a>'hatch'</a> element via a
+ <a>'fill'</a> or <a>'stroke'</a> property) and then
+ applying the transform specified by attribute
+ <a>'hatchTransform'</a>. Percentages
+ represent values relative to the current viewport.
+ </p>
+ </dd>
+
+ <dt>objectBoundingBox</dt>
+ <dd>
+ <p>
+ If <span class="attr-value">hatchUnits="objectBoundingBox"</span>,
+ the user coordinate system for attributes
+
+ <a>'x'</a>, <a>'y'</a>, <a>'pitch'</a>, and <a>'angle'</a>
+
+ is established using the bounding box of the element to
+ which the hatch is applied
+ (see <a href="coords.html#ObjectBoundingBox">Object
+ bounding box units</a>) and then applying the transform
+ specified by attribute <a>'hatchTransform'</a>.
+ Percentages represent values relative to the bounding box
+ for the object.
+ </p>
+ </dd>
+
+ </dl><!-- Attribute values -->
+
+ </dd>
+
+ <dt id="HatchElementHatchContentUnitsAttribute">
+ <span class="adef">hatchContentUnits</span>
+ </dt>
+ <dd>
+
+ <p>
+ Defines the coordinate system for the contents of the
+ <a>'hatch'</a>.
+ </p>
+
+ <dl class="attrdef-svg2">
+
+ <dt>Value</dt> <dd>userSpaceOnUse | objectBoundingBox</dd>
+ <dt><a>Lacuna value</a></dt> <dd>userSpaceOnUse</dd>
+ <dt><a>Animatable</a></dt> <dd>yes</dd>
+
+ </dl>
+
+ <dl class="attrdef-values">
+
+ <dt>userSpaceOnUse</dt>
+ <dd>
+ <p>
+ If <span class="attr-value">hatchContentUnits="userSpaceOnUse"</span>,
+ the user coordinate system for the contents of the <a>'hatch'</a>
+ element is the coordinate system that results from taking
+ the current user coordinate system in place at the time
+ when the <a>'hatch'</a> element is referenced (i.e., the
+ user coordinate system for the element referencing the
+ <a>'hatch'</a> element via a <a>'fill'</a> or <a>'stroke'</a>
+ property) and then applying the transform specified by attribute
+ <a>'hatchTransform'</a>.
+ </p>
+ </dd>
+
+ <dt>objectBoundingBox</dt>
+ <dd>
+ <p>
+ If <span class="attr-value">hatchContentUnits="objectBoundingBox"</span>,
+ the user coordinate system for the contents of
+ the <a>'hatch'</a> element is established using the
+ bounding box of the element to which the hatch is
+ applied
+ (see <a href="coords.html#ObjectBoundingBox">Object
+ bounding box units</a>) and then applying the transform
+ specified by attribute <a>'hatchTransform'</a>.
+ </p>
+ </dd>
+
+ </dl><!-- Attribute values -->
+
+ </dd>
+
+ <dt id="HatchElementHatchTransformAttribute">
+ <span class="adef">hatchTransform</span>
+ </dt>
+ <dd>
+
+ <p>
+ Contains the definition of an optional additional
+ transformation from the hatch coordinate system onto the
+ target coordinate system
+
+ (i.e., <span class='attr-value'>'userSpaceOnUse'</span> or
+ <span class='attr-value'>'objectBoundingBox'</span>).
+
+ This allows for things such as skewing the hatch strips.
+
+ This additional transformation matrix is post-multiplied to
+ (i.e., inserted to the right of) any previously defined
+ transformations, including the implicit transformation
+ necessary to convert
+ from <a href="coords.html#ObjectBoundingBox">object bounding
+ box units</a> to user space.
+ </p>
+
+ <dl class="attrdef-svg2">
+ <dt>Value</dt> <dd><a><transform-list></a></dd>
+ <dt><a>Lacuna value</a></dt> <dd>identity transform</dd>
+ <dt><a>Animatable</a></dt> <dd>yes</dd>
+ </dl>
+
+ </dd>
+
+ <dt id="HatchElementXAttribute"><span class="adef">x</span></dt>
+ <dd>
+ <p>
+ <a>'x'</a>, <a>'y'</a>, <a>'pitch'</a> and <a>'angle'</a>
+ indicate how the hatch strips are placed and spaced. These
+ attributes represent coordinates and values in the coordinate
+ space specified by the combination of
+ attributes <a>'hatchUnits'</a>
+ and <a>'hatchTransform'</a>.
+ </p>
+
+ <dl class="attrdef-svg2">
+ <dt>Value</dt> <dd><a><length></a></dd>
+ <dt><a>Lacuna value</a></dt> <dd>0</dd>
+ <dt><a>Animatable</a></dt> <dd>yes</dd>
+ </dl>
+
+ </dd>
+
+ <dt id="HatchElementYAttribute"><span class="adef">y</span></dt>
+ <dd>
+
+ <p>
+ See <a>'x'</a>.
+ </p>
+
+ <dl class="attrdef-svg2">
+ <dt>Value</dt> <dd><a><length></a></dd>
+ <dt><a>Lacuna value</a></dt> <dd>0</dd>
+ <dt><a>Animatable</a></dt> <dd>yes</dd>
+ </dl>
+
+ </dd>
+
+ <dt id="HatchElementPitchAttribute"><span class="adef">pitch</span></dt>
+ <dd>
+
+ <p>
+ See <a>'x'</a>.
+ </p>
+
+ <dl class="attrdef-svg2">
+ <dt>Value</dt> <dd><a><length></a></dd>
+ <dt><a>Lacuna value</a></dt> <dd>0</dd>
+ <dt><a>Animatable</a></dt> <dd>yes</dd>
+ </dl>
+
+ <p>
+ A negative value is an error
+ (see <a href="implnote.html#ErrorProcessing">Error
+ processing</a>). A value of zero disables rendering of the
+ element (i.e., no paint is applied).
+ </p>
+
+ </dd>
+
+ <dt id="HatchElementAngleAttribute"><span class="adef">angle</span></dt>
+ <dd>
+
+ <p>
+ See <a>'x'</a>.
+ </p>
+
+ <dl class="attrdef-svg2">
+ <dt>Value</dt> <dd><a><angle></a></dd>
+ <dt><a>Lacuna value</a></dt> <dd>0</dd>
+ <dt><a>Animatable</a></dt> <dd>yes</dd>
+ </dl>
+
+ </dd>
+
+ <dt id="HatchElementHrefAttribute"><span class="adef">xlink:href</span></dt>
+ <dd>
+ <p>
+ An <a href="linking.html#IRIReference">IRI reference</a> to a
+ different <a>'hatch'</a> element within the current SVG
+ document fragment. Any attributes which are defined on the
+ referenced element which are not defined on this element are
+ inherited by this element. If this element has no children,
+ and the referenced element does (possibly due to its
+ own <a>'xlink:href'</a> attribute), then this element inherits
+ the children from the referenced element. Inheritance can be
+ indirect to an arbitrary level; thus, if the referenced
+ element inherits attributes or children due to its
+ own <a>'xlink:href'</a> attribute, then the current element
+ can inherit those attributes or children.
+ </p>
+
+ <dl class="attrdef-svg2">
+ <dt>Value</dt> <dd><a><iri></a></dd>
+ <dt><a>Lacuna value</a></dt> <dd>empty</dd>
+ <dt><a>Animatable</a></dt> <dd>yes</dd>
+ </dl>
+
+ </dd>
+
+ </dl>
+
+<h3 id="HatchNotes">Notes on hatches</h3>
+
+<p>SVG's <a href="styling.html#UAStyleSheet">user agent style sheet</a> sets
+the <a>'overflow'</a> property for <a>'hatch'</a> elements to
+<span class="prop-value">hidden</span>, which causes an infinite strip clipping
+path to be created at the bounds of the hatch strip. Unless the
+<a>'overflow'</a> property is overridden, any graphics within the
+hatch which goes outside of the hatch strip will be clipped. Note that
+if the <a>'overflow'</a> property is set
+to <span class="prop-value">visible</span> the area outside must be
+rendered (NB this is different from a <a>'pattern'</a>
+element). Strips with higher <var>x</var> (larger <var>m</var>) values
+must be rendered after strips with lower <var>x</var>
+(lower <var>m</var>) values.</p>
+
+<p class="issue">The default should probably be visible.</p>
+
+<p>The contents of the <a>'hatch'</a> are relative to a new coordinate
+system. The new coordinate system has its origin at
+(<var>x</var>, <var>y</var>), where <var>x</var> is established
+by the <a>'x'</a> attribute on the <a>'hatch'</a> element,
+and <var>y</var> is established by the <a>'y'</a> attribute on
+the <a>'hatch'</a> element. The coordinate system is rotated around
+the origin by the angle given by the <a>'angle'</a> attribute.
+</p>
+
+<p class="issue">The viewBox and preserveAspectRatio attributes are
+not useful and have been removed (as compared to the pattern element).</p>
+
+<p><a href="script.html#EventAttributes">Event attributes</a> and
+<a href="svgdom.html#EventListeners">event listeners</a> attached
+to the contents of a <a>'hatch'</a> element are not processed;
+only the rendering aspects of <a>'hatch'</a> elements are
+processed.</p>
+
+
+<p>The following illustrates a very simple <a>'hatch'</a> fill:</p>
+
+<!--
+<edit:example href='images/pservers/pattern01.svg' name='hatch01'
+ description='fill a rectangle by referencing a hatch paint server' image='yes' link='yes'/>
+-->
+<div class="example">
+<pre><![CDATA[
+<hatch pitch="5" angle="135">
+ <hatchPath stroke="#a080ff" stroke-width="2"/>
+</hatch>
+]]></pre>
+<div class="figure">
+ <img
+ alt="A hatch example with parallel lines filling a rectangle at a 45 degree angle."
+ src="images/pservers/hatch01.png"/>
+ <p class="caption">A hatch with a single <a>'hatchPath'</a>.
+ </p>
+</div>
+</div>
+
+<p class="issue">Proper examples with links to the SVG need to be given.</p>
+
+</edit:with>
+
+<h3 id="HatchPaths">Hatch paths</h3>
+
+<edit:with element='hatchPath'>
+
+<p id="HatchPathElement">Hatch paths are defined by a <a>'hatchPath'</a> element.</p>
+
+<edit:elementsummary name='hatchPath'/>
+
+<h4 id="HatchPathElementAttributes">Attributes</h4>
+
+ <dl class="attrdef-list-svg2">
+
+ <dt id="HatchPathElementDAttribute"><span class="adef">d</span></dt>
+ <dd>
+
+ <p>
+ Defines a single path in the <a>'hatch'</a>.
+ </p>
+
+ <dl class="attrdef-svg2">
+
+ <dt>Value</dt> <dd><a href="#PathData">Path data</a></dd>
+ <dt><a>Lacuna value</a></dt> <dd>An infinite line, see below</dd>
+ <dt><a>Animatable</a></dt> <dd>yes</dd>
+
+ </dl>
+
+ </dd>
+
+ <dt id="HatchPathElementOffsetAttribute"><span class="adef">offset</span></dt>
+ <dd>
+
+ <p>
+ Defines the point along the reference line where a path begins.
+ </p>
+
+ <dl class="attrdef-svg2">
+
+ <dt>Value</dt> <dd><a><length></a></dd>
+ <dt><a>Lacuna value</a></dt> <dd>0</dd>
+ <dt><a>Animatable</a></dt> <dd>yes</dd>
+
+ </dl>
+
+ </dd>
+
+ </dl>
+
+<h4 id="HatchPathNotes">Notes on hatch paths</h4>
+
+<p>Hatch paths are defined with the same <a href="#PathData">Path
+data</a> used in the <a>'d'</a> attribute of the <a>'path'</a>
+element. The path is defined relative to the origin of each strip
+translated in the <var>x</var> direction by the <a>'offset'</a>
+(the <var>y</var> direction is aligned along the infinite axis of the
+strip).
+</p>
+
+<div class="figure">
+ <img
+ alt="A diagram showing the coordinate system for the 'd' attribute."
+ src="images/pservers/hatch_path_attributes.svg"/>
+ <p class="caption">The coordinate system for path data relative to a strip.
+ </p>
+</div>
+
+<p>If a <a>'d'</a> attribute is not provided, the path defaults to an
+infinitely long line aligned with the <var>y</var>-axis of the
+reference strip and passing through a point <a>'offset'</a> distance
+in the <var>x</var> direction from the strip origin (see above).
+</p>
+
+<p>If a <a>'d'</a> attribute is given, the hatch path is constructed
+by repeating the <a>'d'</a> data, each time with an offset along the
+<var>y</var>-axis determined by the <var>y</var> value of the last
+path data point. (The offset must be positive, a negative or zero
+offset value results in the hatch path not being rendered.) A hatch
+path need not start with a "moveto" path instruction. If missing, the
+first path instruction uses for its current point a value of
+(<var>x</var>,<var>0</var>) where <var>x</var> is the <var>x</var>
+value of the last data point given in the path. If the first path
+command is not a "moveto" and the last not a "closepath", the last
+point of each repeating section is joined to the first point of the
+next repeating section with the current value
+of <a>'stroke-linejoin'</a>.
+</p>
+
+<!--
+<edit:example href='images/pservers/pattern01.svg' name='hatch01'
+ description='fill a rectangle by referencing a hatch paint server' image='yes' link='yes'/>
+-->
+<div class="example">
+<pre><![CDATA[
+<hatch hatchUnits="userSpaceOnUse" pitch="6">
+ <hatchPath stroke-width="1" d="c 0,4 8,6 8,10 8,14 0,16 0,20"/>
+</hatch>]]></pre>
+<div class="figure">
+ <img
+ alt="A hatch example with squiggly lines filling a rectangle."
+ src="images/pservers/hatch02.png"/>
+ <p class="caption">A hatch fill with a continuous squiggly <a>'hatchPath'</a>.
+ </p>
+</div>
+</div>
+
+<div class="example">
+<pre><![CDATA[
+<hatch hatchUnits="userSpaceOnUse" pitch="20">
+ <hatchPath stroke-width="2" d="L 0,0 10,50"/>
+</hatch>]]></pre>
+<div class="figure">
+ <img
+ alt="A hatch example with a zigzag line."
+ src="images/pservers/hatch03.png"/>
+ <p class="caption">A hatch fill with a zigzag <a>'hatchPath'</a>.
+ The <a>'d'</a> path data describes two line segments, the first
+ starting at (10, 0). The repeating sections are joined.
+ </p>
+</div>
+</div>
+
+<div class="example">
+<pre><![CDATA[
+<hatch hatchUnits="userSpaceOnUse" pitch="20">
+ <hatchPath stroke-width="2" d="M 0,0 10,50"/>
+</hatch>]]></pre>
+<div class="figure">
+ <img
+ alt="A hatch example with diagonal lines segments filling a rectangle."
+ src="images/pservers/hatch04.png"/>
+ <p class="caption">A hatch fill with diagonal line segments. The
+ repeating sections are not joined.
+ </p>
+</div>
+</div>
+
+<div class="example">
+<pre><![CDATA[
+<hatch hatchUnits="userSpaceOnUse" pitch="20">
+ <hatchPath stroke-width="2"/>
+ <hatchPath stroke-width="2" offset="5" stroke-dasharray="10 4 2 4"/>
+</hatch>]]></pre>
+<div class="figure">
+ <img
+ alt="A hatch example with two alternating lines, one dashed."
+ src="images/pservers/hatch05.png"/>
+ <p class="caption">A hatch fill with two <a>'hatchPath'</a>s, one dashed.
+ </p>
+</div>
+</div>
+
+</edit:with>
+
<h2 id="DOMInterfaces">DOM interfaces</h2>
<h3 id="InterfaceSVGSolidColorElement">Interface SVGSolidColorElement</h3>
@@ -2239,5 +2702,25 @@
</edit:with>
+<h3 id="InterfaceSVGHatchElement">Interface SVGSolidHatchElement</h3>
+
+<edit:with element='hatch'>
+
+<pre class="idl"></pre>
+
+<p class="issue">IDL needs to be added for SVGHatchElement.</p>
+
+</edit:with>
+
+<h3 id="InterfaceSVGHatchPathElement">Interface SVGSolidHatchPathElement</h3>
+
+<edit:with element='hatchesPath'>
+
+<pre class="idl"></pre>
+
+<p class="issue">IDL needs to be added for SVGHatchPathElement.</p>
+
+</edit:with>
+
</body>
</html>