<
svg id="svg-root"
width="450"
height="450" xmlns:xlink="
http://www.w3.org/1999/xlink" xmlns="
http://www.w3.org/2000/svg" >
<
title id="test-title">filters-many-BE-01</
title>
<
desc id="test-desc">Overall filter effects test case. Extracted from example filters00 in the March 3, 2000 spec.</
desc>
<
g id="test-body-content">
<
g style="
font-size:12;
font-family:Verdana;">
<
text x="20"
y="30">A single filter that uses a combination of filter primitives.</
text>
<
text x="20"
y="45">You should see a gray rectangle. Inside, there is an outer</
text>
<
text x="20"
y="60">ring and an inner button with "SVG" on it, both in red</
text>
<
text x="20"
y="75">with a 3D appearance and a lighting effect.</
text>
</
g>
<
svg x="10"
y="30"
width="430"
height="370"
viewBox="0 0 200 120">
<
title>Example filters01.svg - introducing filter effects</
title>
<
desc>An example which combines multiple filter primitives to produce a 3D lighting effect on a graphic consisting of the string "SVG" sitting on top of oval filled in red and surrounded by an oval outlined in red.</
desc>
<
defs>
<
filter id="MyFilter"
filterUnits="userSpaceOnUse"
x="0"
y="0"
width="450"
height="450">
<
feGaussianBlur in="SourceAlpha"
stdDeviation="4"
result="blur"/>
<
feOffset in="blur"
dx="4"
dy="4"
result="offsetBlur"/>
<
feSpecularLighting in="blur"
surfaceScale="5"
specularConstant=".75"
specularExponent="20"
style="
lighting-color:white;"
result="specOut">
<
fePointLight x="-5000"
y="-10000"
z="20000"/>
</
feSpecularLighting>
<
feComposite in="specOut"
in2="SourceAlpha"
operator="in"
result="specOut"/>
<
feComposite in="SourceGraphic"
in2="specOut"
operator="arithmetic"
k1="0"
k2="1"
k3="1"
k4="0"
result="litPaint"/>
<
feMerge>
<
feMergeNode in="offsetBlur"/>
<
feMergeNode in="litPaint"/>
</
feMerge>
</
filter>
</
defs>
<
rect x="1"
y="1"
width="198"
height="118"
style="
fill:#888888;
stroke:blue;"/>
<
g style="
filter:url(#MyFilter);">
<
g>
<
path style="
fill:none;
stroke:#D90000;
stroke-width:10;"
d="M50,90 C0,90 0,30 50,30 L150,30 C200,30 200,90 150,90 z"/>
<
path style="
fill:#D90000;"
d="M60,80 C30,80 30,40 60,40 L140,40 C170,40 170,80 140,80 z"/>
<
g style="
fill:#FFFFFF;
stroke:black;
font-size:45;
font-family:Verdana;">
<
text x="52"
y="76">SVG</
text>
</
g>
</
g>
</
g>
</
svg>
</
g>
<
g id="test-legend"
style="
fill:black;
font-family:Helvetica;
font-size:10;">
<
rect x="10"
y="390"
width="275"
height="50"
style="
fill:none;
stroke:#000000;"/>
<
path style="
fill:none;
stroke:#000000;"
d="M10 405 h275 M205 405 v35 M10 426 h195 M205 422 h80"/>
<
text x="25"
y="401">Scalable Vector Graphics (SVG) Conformance Suite</
text>
<
a xlink:href="copyright-documents-19990405.html">
<
text x="12"
y="437"
style="
fill:blue;">Copyright 2000 W3C. All Rights Reserved.</
text>
</
a>
<
text style="
font-size:12;"
x="35"
y="420">filters-many-BE-01</
text>
<
text style="
font-size:10;"
x="210"
y="417">$Revision: 1.1 $</
text>
<
text style="
font-size:10;"
x="210"
y="435">Release 2.0</
text>
<
rect id="test-frame"
x="1"
y="1"
width="448"
height="448"
style="
fill:none;
stroke:#000000;"/>
</
g>
</
svg>