- From: SVG Working Group repository <cam+svgwgrepo@mcc.id.au>
- Date: Thu, 10 Apr 2014 08:02:25 -0700
- To: public-svg-wg@w3.org
details: https://svgwg.org/hg/svg2/rev/6dc0cdba8335
branches:
changeset: 653:6dc0cdba8335
user: Erik Dahlstr?m <ed@opera.com>
date: Thu Apr 10 16:59:23 2014 +0200
description:
ACTION-3576: Make width and height attributes presentation attributes on the svg element.
diffstat:
master/changes.html | 3 +++
master/coords.html | 26 ++++++++++++--------------
master/definitions.xml | 4 ++--
master/struct.html | 11 +++++++----
4 files changed, 24 insertions(+), 20 deletions(-)
diffs (226 lines):
diff --git a/master/changes.html b/master/changes.html
--- a/master/changes.html
+++ b/master/changes.html
@@ -121,16 +121,19 @@ have been made.</p>
<li>Moved the <a>'image'</a> element to the <a href='embedded.html'>Embedded Content chapter</a>.</li>
<li>Removed the <code>SVGElementInstance</code> and <code>SVGElementInstanceList</code> interfaces, and the corresponding attributes on the <a>SVGUseElement</a> interface.</li>
<li>Changed the <a>'use'</a> element event flow to follow the Shadow DOM spec.</li>
<li>Clarified that the <a>'switch'</a> element does not affect processing of <a>'script'</a> elements.</li>
+
+ <li>Made the <a>'svg/width'</a> and <a>'svg/height'</a> attributes on the <a>'svg'</a> element presentation attributes, and changed the lacuna value to
+ <span class="attr-value">auto</span>.</li>
</ul>
<h3 id="styling">Styling chapter</h3>
<ul>
<li>Removed the <span class="attr-name">'contentStyleType'</span> attribute.</li>
</ul>
diff --git a/master/coords.html b/master/coords.html
--- a/master/coords.html
+++ b/master/coords.html
@@ -1459,25 +1459,21 @@ the applicable element has no width or h
class="attr-value">objectBoundingBox</span> is specified, then
the given effect (e.g., a gradient or a filter) will be
ignored.</p>
<h2 id="IntrinsicSizing">Intrinsic sizing properties of the viewport of SVG content</h2>
<p>SVG needs to specify how to calculate some intrinsic sizing properties to
enable inclusion within other languages. The intrinsic width and height
-of the <a>viewport</a> of SVG content must be determined from the <a>'svg/width'</a>
-and <a>'svg/height'</a> attributes. If either of these are not specified, a
-value of <span class="attr-value">'100%'</span> must be assumed.
-<em>Note:</em> the <a>'svg/width'</a> and <a>'svg/height'</a>
-attributes are <em>not the same</em> as the CSS width and height properties.
-Specifically, percentage values <em>do not provide an intrinsic width or height,
-and do not indicate a percentage of the containing block</em>. Rather, once the
-viewport is established, they indicate the portion of the viewport that is
-actually covered by image data.</p>
+of the <a>viewport</a> of SVG content must be determined from the <a>'width property'</a>
+and <a>'height property'</a> presentation attributes. If either of these are not specified, a
+value of <span class="attr-value">'auto'</span> must be assumed.
+Specifically, percentage values <em>do not provide an intrinsic width or height.</em>.
+</p>
<p>The intrinsic aspect ratio of the <a>viewport</a> of SVG content is necessary
for example, when including SVG from an <span class="element-name">'object'</span> element in HTML styled with
CSS. It is possible (indeed, common) for an SVG graphic to have an intrinsic aspect ratio but not to have an intrinsic width or height.
The intrinsic aspect ratio must be calculated based upon the
following rules:</p>
<ul>
@@ -1498,74 +1494,76 @@ following rules:</p>
<p>Examples:</p>
<div class="example">
<div class="exampleheader">
<strong>Example:</strong> Intrinsic Aspect Ratio 1
</div>
<div class="examplesource">
-<pre><![CDATA[<svg xmlns="http://www.w3.org/2000/svg" version="1.2" baseProfile="tiny"
+<pre><![CDATA[<svg xmlns="http://www.w3.org/2000/svg"
width="10cm" height="5cm">
...
</svg>]]></pre>
</div>
</div>
<p>In this example the intrinsic aspect ratio of the <a>viewport</a> is 2:1. The
intrinsic width is 10cm and the intrinsic height is 5cm.</p>
<div class="example">
<div class="exampleheader">
<strong>Example:</strong> Intrinsic Aspect Ratio 2
</div>
<div class="examplesource">
-<pre><![CDATA[<svg xmlns="http://www.w3.org/2000/svg" version="1.2" baseProfile="tiny"
+<pre><![CDATA[<svg xmlns="http://www.w3.org/2000/svg"
width="100%" height="50%" viewBox="0 0 200 200">
...
</svg>]]></pre>
</div>
</div>
<p>In this example the intrinsic aspect ratio of the rootmost <a>viewport</a> is
1:1. An aspect ratio calculation in this case allows embedding in an
object within a containing block that is only constrained in one direction.</p>
<div class="example">
<div class="exampleheader">
<strong>Example:</strong> Intrinsic Aspect Ratio 3
</div>
<div class="examplesource">
-<pre><![CDATA[<svg xmlns="http://www.w3.org/2000/svg" version="1.2" baseProfile="tiny"
+<pre><![CDATA[<svg xmlns="http://www.w3.org/2000/svg"
width="10cm" viewBox="0 0 200 200">
...
</svg>]]></pre>
</div>
</div>
<p>In this case the intrinsic aspect ratio is 1:1.</p>
<div class="example">
<div class="exampleheader">
<strong>Example:</strong> Intrinsic Aspect Ratio 4
</div>
<div class="examplesource">
-<pre><![CDATA[<svg xmlns="http://www.w3.org/2000/svg" version="1.2" baseProfile="tiny"
+<pre><![CDATA[<svg xmlns="http://www.w3.org/2000/svg"
width="75%" height="10cm" viewBox="0 0 200 200">
...
</svg>]]></pre>
</div>
</div>
<p>In this example, the intrinsic aspect ratio is 1:1.</p>
-
+<p class="issue">Add more examples for the new auto value? E.g some of the
+<a href="https://docs.google.com/presentation/d/1POUiroOBbLmXYlQKf0pIR8zVkHWH9jRVN-w8A4aNsIk/">examples</a>
+provided by David Vest.</p>
<h2 id="GeographicCoordinates">Geographic coordinate systems</h2>
<p>In order to allow interoperability between SVG content generators
and user agents dealing with maps encoded in SVG, the use of a common
metadata definition for describing the coordinate system used to
generate SVG documents is encouraged.</p>
diff --git a/master/definitions.xml b/master/definitions.xml
--- a/master/definitions.xml
+++ b/master/definitions.xml
@@ -701,18 +701,18 @@
contentmodel='anyof'
elementcategories='animation, descriptive, shape, structural, paint server'
elements='a, altGlyphDef, clipPath, cursor, filter, font, font-face, foreignObject, image, marker, mask, script, style, switch, text, view'
attributecategories='aria, navigation, conditional processing, core, document event, graphical event, presentation, style'
attributes='viewBox, preserveAspectRatio, zoomAndPan'
interfaces='SVGSVGElement'>
<attribute name='x' href='struct.html#SVGElementXAttribute' animatable='yes'/>
<attribute name='y' href='struct.html#SVGElementYAttribute' animatable='yes'/>
- <attribute name='width' href='struct.html#SVGElementWidthAttribute' animatable='yes'/>
- <attribute name='height' href='struct.html#SVGElementHeightAttribute' animatable='yes'/>
+ <attribute name='width' href='struct.html#SVGElementWidthAttribute' animatable='yes' presentation='yes'/>
+ <attribute name='height' href='struct.html#SVGElementHeightAttribute' animatable='yes' presentation='yes'/>
<attribute name='version' href='struct.html#SVGElementVersionAttribute'/>
<attribute name='baseProfile' href='struct.html#SVGElementBaseProfileAttribute'/>
<attribute name='playbackOrder' href='struct.html#SVGElementPlaybackOrderAttribute' animatable='no'/>
<attribute name='timelineBegin' href='struct.html#SVGElementTimelineBeginAttribute' animatable='no'/>
</element>
<element
name='switch'
diff --git a/master/struct.html b/master/struct.html
--- a/master/struct.html
+++ b/master/struct.html
@@ -363,26 +363,27 @@ create SVG fragments.</p>
<tr>
<th>Name</th>
<th>Value</th>
<th>Lacuna value</th>
<th>Animatable</th>
</tr>
<tr>
<td><dfn data-dfn-type="element-attr" data-dfn-for="svg" id="SVGElementWidthAttribute">width</dfn>, <dfn data-dfn-type="element-attr" data-dfn-for="svg" id="SVGElementHeightAttribute">height</dfn></td>
- <td><a><length></a> | <a><percentage></a></td>
- <td>100%</td>
+ <td>See <a>'width property'</a> and <a>'height property'</a></td>
+ <td>auto</td>
<td>yes</td>
</tr>
</table>
</dt>
<dd>
+ <p class="note">Note that <a>'width'</a> and <a>'height'</a> are presentation attributes.</p>
<p>For <a>outermost svg elements</a>,
- the <a>'width'</a> and <a>'height'</a> attributes specify
- the intrinsice size of the SVG document fragment.
+ the <a>'width property'</a> and <a>'height property'</a> attributes specify
+ the intrinsic size of the SVG document fragment.
For embedded <a>'svg'</a> elements, they specify the size
of the rectangular region into which the <a>'svg'</a> element
is placed.</p>
<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.</p>
<p class="issue">When zero is used on an outer <a>'svg'</a> element,
does this disable rendering too? Or does it just affect
@@ -2495,25 +2496,27 @@ Corresponds to attribute <a>'y'</a> on t
</div>
</dd>
<dt id="__svg__SVGSVGElement__width" class="attribute"><b>width</b><span class="idl-type-parenthetical"> (readonly <a class="idlinterface" href="types.html#InterfaceSVGAnimatedLength">SVGAnimatedLength</a>)</span></dt>
<dd class="attribute">
<div>
Corresponds to attribute <a>'width'</a> on the given <a>'svg'</a>
element.
+<p class="issue">What value should be returned here (since this is now a presentation attribute)?</p>
</div>
</dd>
<dt id="__svg__SVGSVGElement__height" class="attribute"><b>height</b><span class="idl-type-parenthetical"> (readonly <a class="idlinterface" href="types.html#InterfaceSVGAnimatedLength">SVGAnimatedLength</a>)</span></dt>
<dd class="attribute">
<div>
Corresponds to attribute <a>'height'</a> on the given <a>'svg'</a>
element.
+<p class="issue">What value should be returned here (since this is now a presentation attribute)?</p>
</div>
</dd>
<dt id="__svg__SVGSVGElement__viewport" class="attribute"><b>viewport</b><span class="idl-type-parenthetical"> (readonly <a class="idlinterface" href="types.html#InterfaceSVGRect">SVGRect</a>)</span></dt>
<dd class="attribute">
<div>
Received on Thursday, 10 April 2014 15:03:01 UTC