Source code
Revision control
Copy as Markdown
Other Tools
<svg version="1.1" baseProfile="basic" id="svg-root"
width="100%" height="100%" viewBox="0 0 480 360"
<!--======================================================================-->
<!--= SVG 1.1 2nd Edition Test Case =-->
<!--======================================================================-->
<!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =-->
<!--= Institute of Technology, European Research Consortium for =-->
<!--= Informatics and Mathematics (ERCIM), Keio University). =-->
<!--= All Rights Reserved. =-->
<!--======================================================================-->
template-version="1.4" reviewer="CL" author="BB" status="accepted"
version="$Revision: 1.4 $" testname="$RCSfile: struct-use-05-b.svg,v $">
<d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#UseElement">
<p>
This file is intented to test the computed values in external references.
Both files (referencing and referenced) define similar colors/gradients via 'color', 'linearGradient' and 'radialGradient'.
The ids of those definitions are the same but the actual appearance are different. These definitions are used to test the
property inheritance feature of SVG.
</p>
</d:testDescription>
<p>
[[
Describe how to use the here. The instructions should specify any
steps requied to run the test or any manual operation that need
to be performed to run the test.
]]
</p>
</d:operatorScript>
<p>
The top left rectangle should be filled with the blue linear gradient since the 'use' has a specified value
defined in the 'defs' section. The top right rectangle is forestgreen since the 'use' has a computed value.
The bottom left rectangle is also forestgreen since the fill is not inherited from the referenced element's original parent.
The bottom right rectangle is filled with the orange radial gradient since the computed value is given by the CSS cascade.
</p>
</d:passCriteria>
</d:SVGTestCase>
<title id="test-title">$RCSfile: struct-use-05-b.svg,v $</title>
<defs>
<font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F">
<font-face-src>
<font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/>
</font-face-src>
</font-face>
</defs>
<g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18">
<g color="forestgreen">
<defs>
<linearGradient id="linearGrad1" gradientUnits="objectBoundingBox" y1="0" x1="0" y2="1" x2="1">
<stop offset="000%" stop-color="royalblue"/>
<stop offset="033%" stop-color="white"/>
<stop offset="050%" stop-color="darkblue"/>
<stop offset="066%" stop-color="white"/>
<stop offset="100%" stop-color="royalblue"/>
</linearGradient>
<radialGradient id="radialGrad1" gradientUnits="objectBoundingBox" cx="0.5" cy="0.5" r="0.5" fx="0.15" fy="0.15">
<stop offset="000%" stop-color="royalblue"/>
<stop offset="033%" stop-color="white"/>
<stop offset="050%" stop-color="darkblue"/>
<stop offset="066%" stop-color="white"/>
<stop offset="100%" stop-color="royalblue"/>
</radialGradient>
</defs>
<use xlink:href="../images/svgRef1.svg#rect1" fill="url(#linearGrad1)"/>
<use xlink:href="../images/svgRef1.svg#rect2" fill="currentColor"/>
<use xlink:href="../images/svgRef1.svg#rect3"/>
<use xlink:href="../images/svgRef1.svg#rect4"/>
<text font-size="24" x="240" y="35" text-anchor="middle">External references and computed values</text>
</g>
</g>
<g font-family="SVGFreeSansASCII,sans-serif" font-size="32">
<text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.4 $</text>
</g>
<rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/>
<!-- comment out this watermark once the test is approved -->
<!--<g id="draft-watermark">
<rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/>
<text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240"
text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text>
</g>-->
</svg>