W3C home > Mailing lists > Public > www-svg@w3.org > November 2012

Re: Proposal: Nesting SVG Graphics Elements

From: Ken Stacey <ken@svgmaker.com>
Date: Fri, 30 Nov 2012 15:52:31 +1000
Message-ID: <50B8499F.20202@svgmaker.com>
To: www-svg@w3.org
I like the idea, I think it could be used in many creative ways.  I also 
think that there is scope for confusion and implementation complexity.

Some initial thoughts:

If each graphics element can create a new viewport, then each can have a 
viewBox also?
and preserveAspectRatio?  (possible author confusion)

<circle ... viewBox="0 0 100 100">
  <rect .../>
</circle>

All presentation attributes would be allowed on any graphics element? 
(possible author confusion)

<rect ... font-family="Arial" font-size="20">
   <text>abc</rect>
</rect>

Would this be allowed?

<text>
  <rect x="0" y="0" width="100%" height="100%"/>
  <tspan>abc</tspan><tspan>def</tspan>
</text>

The idea is to have a rect which is always the size of the rendered 
text.  Presuming that the viewport is defined by (say) the BBox of the 
<text> element, the rect will not know the extents of the text until 
after the text element has been processed.  (implementation complexity)

Ken

On 30/11/2012 5:52 AM, Doug Schepers wrote:
> Hi, SVG WG-
>
> I have a proposal that may make SVG2 easier to understand and use for
> people already familiar with the HTML+CSS world.
>
> The basic idea is to allow rendering elements to also serve as container
> elements, with child rendering elements also rendered. (This is
> currently not very clearly specified in SVG1.1.)
>
> Currently, to associate 2 rendering elements, you have to use a group,
> like this:
>
>    <g id="g1">
>      <rect id="r1" x="5" y="10" width="70" height="40" fill="yellow"
> stroke="red" />
>      <text id="t1" x="15" y="35" font-size="12" fill="crimson">Some
> label</text>
>    </g>
>
> This can be problematic for positioning the elements relative to one
> other, and to moving the whole unit (yes, you can use a transform, but
> for drag-n-drop, you have to know what to grab and drag).
>
> We could allow authors to do this by simply nesting the text element,
> which would render on top of the rect (using the same Painter's Model),
> and could be positioned relative to the new established coordinate space
> of the parent shape:
>
>    <rect id="r2" x="5" y="10" width="70" height="40" fill="yellow"
> stroke="red">
>      <text id="t2" x="50%" y="50%" font-size="12" fill="crimson">Some
> label</text>
>    </rect>
>
> This also carries the benefit of being more accessible and semantic.
> After talking to several designers, I think it matches the conceptual
> model of containment and presentation from HTML and CSS (though it is
> distinctly different in some ways, since SVG merges the content and
> presentation modes).
>
> The nesting relationship wouldn't have to be one of "visual containment"
> like in the label example... it can be a simple one-directional
> constraint system, which is not hard to deal with:
>
>    <g id="g3">
>      <rect id="r3" x="100" y="10" width="40" height="40"/>
>      <circle id="c3" cx="170" cy="30" r="20"/>
>    </g>
>
> Would be visually equivalent to:
>
>    <rect id="r4" x="100" y="10" width="40" height="40">
>      <circle id="c4" cx="70" cy="20" r="20"/>
>    </rect>
>
> And when r4 is moved, c4 keeps the same relationship relative to it.
>
> We would need to sort out many detail, but I think this is doable fairly
> simply, and has a low risk of backwards incompatibility.
>
> This also solves some problems that I see coming up in SVG2 and Connectors.
>
> I'd like discuss this briefly in the telcon, before I develop it further.
>
> Regards-
> -Doug
>
Received on Friday, 30 November 2012 05:53:02 GMT

This archive was generated by hypermail 2.3.1 : Friday, 8 March 2013 15:54:53 GMT