RE: <use> element and inheritance

In most cases, if you set 'visibility:hidden' on a <use> element, this
will indeed cause the referenced object to be invisible. However, there
are cases (obscure?) when this may not be the case. For example, if you
have the following SVG content:

<svg width="400px" height="300px">
  <defs>
    <rect id="r1" x="100" y="100" width="200" height="100" fill="red"/>
    <rect id="r2" x="100" y="200" width="200" height="100" fill="blue"
visibility="visible"/>
  </defs>
  <text x="100" y="90" font-size="24">Do you see a red rect?</text>
  <use xlink:href="#r1" visibility="hidden"/>
  <text x="100" y="190" font-size="24">Do you see a blue rect?</text>
  <use xlink:href="#r2" visibility="hidden"/>
</svg>

The blue rectangle will show even though the <use> element that
references it specifies visibility="hidden". This is because the
visibility property only applies to individual leaf nodes (i.e.,
individual graphic objects) and does *not* operate on a group basis.
Instead, if you want to force an entire group to disappear, use the
'display' property with a value of 'none'. For more information, review
the writeups on visibility and display at
http://www.w3.org/TR/SVG/painting.html#VisibilityControl, particularly
the two bullets at the top of section 11.5.

Jon Ferraiolo
SVG 1.0 Editor

> -----Original Message-----
> From: www-svg-request@w3.org [mailto:www-svg-request@w3.org] On Behalf
Of
> Sigurd Lerstad
> Sent: Wednesday, August 07, 2002 4:36 PM
> To: www-svg@w3.org
> Subject: <use> element and inheritance
> 
> 
> Hello,
> 
> From the SVG spec
> 
> 5.6 The 'use' element
> 
> <...>
> Property inheritance, however, works as if the referenced element had
been
> textually included as a deeply cloned child of the 'use' element. The
> referenced element inherits properties from the 'use' element and the
> 'use'
> element's ancestors. An instance of a referenced element does not
inherit
> properties from the referenced element's original parents.
> <...>
> 
> <...>
> The behavior of the 'visibility' property conforms to this model of
> property
> inheritance. Thus, specifying 'visibility:hidden' on a 'use' element
does
> not guarantee that the referenced content will not be rendered. If the
> 'use'
> element specifies 'visibility:hidden' and the element it references
> specifies 'visibility:hidden' or 'visibility:inherit', then that one
> element
> will be hidden. However, if the referenced element instead specifies
> 'visibility:visible', then that element will be visible even if the
'use'
> element specifies 'visibility:hidden'.
> <...>
> ------------
> 
> I don't get the second paragraph...
> 
> Why will the use element not always be invisible if it has
> 'visibility:hidden'? Since property inheritance works as if the
referenced
> element had been textually included as a deeply cloned CHILD of the
'use'
> element.. ?
> 
> 
> thanks,
> 
> --
> Sigurd Lerstad
> 
> 
>

Received on Wednesday, 7 August 2002 12:46:18 UTC