1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
|
<svg version="1.1" baseProfile="basic" id="svg-root"
width="100%" height="100%" viewBox="0 0 480 360"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!--======================================================================-->
<!--= 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. =-->
<!--= See http://www.w3.org/Consortium/Legal/. =-->
<!--======================================================================-->
<d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/"
template-version="1.4" reviewer="SVGWG" author="Peter Graffagnino" status="accepted"
version="$Revision: 1.6 $" testname="$RCSfile: filters-offset-01-b.svg,v $">
<d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feOffsetElement">
<p>
The target crosshairs should align with
lower left bounds of the associated circle.
The color of each crosshair should match
the associated circle.
</p>
<p>
Verify the basic capability to handle the feOffset, feMerge and
feFlood filter nodes. Four copies of a filled circle should appear at
various offsets and colors. For each circle a reference crosshair is
drawn at the lower left of the circle to indicate the expected color,
opacity and position for the filtered element. The targets are drawn
with the standard svg path element.
</p>
<p>
In addition to feFlood, feMerge, and feOffset, this test uses
'feComposite' to recolor the SourceGraphic with the feFlood color.
The source graphic uses 'circle'. The target cross hairs are drawn
with 'path' and use 'fill' and 'fill-opacity'.
</p>
</d:testDescription>
<d:operatorScript xmlns="http://www.w3.org/1999/xhtml">
<p>
Run the test. No interaction required.
</p>
</d:operatorScript>
<d:passCriteria xmlns="http://www.w3.org/1999/xhtml">
<p>
The rendered image should match the reference image. Additionally, the
target crosshairs should match the color, lower left corner, and
opacity of each copy of the filtered circle.
</p>
</d:passCriteria>
</d:SVGTestCase>
<title id="test-title">$RCSfile: filters-offset-01-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">
<defs>
<filter id="FOMTest" filterUnits="objectBoundingBox" x="0" y="0" width="2.5" height="4">
<feOffset result="Off1" dx="40" dy="30"/>
<feFlood result="F1" flood-color="#408000" flood-opacity=".8"/>
<feComposite in2="Off1" operator="in" result="C1"/>
<feOffset in="SourceGraphic" result="Off2" dx="80" dy="60"/>
<feFlood result="F2" flood-color="#408000" flood-opacity=".6"/>
<feComposite in2="Off2" operator="in" result="C2"/>
<feOffset in="SourceGraphic" result="Off3" dx="120" dy="90"/>
<feFlood result="F3" flood-color="#408000" flood-opacity=".4"/>
<feComposite in2="Off3" operator="in" result="C3"/>
<feMerge>
<feMergeNode in="C3"/>
<feMergeNode in="C2"/>
<feMergeNode in="C1"/>
<feMergeNode in="SourceGraphic"/>
</feMerge>
</filter>
</defs>
<circle cx="160" cy="50" r="40" fill="#000" filter="url(#FOMTest)"/>
<!-- Add some crosshairs of the same color of the
flood at the same location as the offset -->
<!-- 20 pixel cross hair at 120,90 -->
<path fill="#000" transform="translate(120, 90)" d="M-1,-11h2v10h10v2h-10v10h-2v-10h-10v-2h10v-10"/>
<!-- 20 pixel cross hair at 160,120 -->
<path fill="#408000" fill-opacity=".8" transform="translate(160, 120)" d="M-1,-11h2v10h10v2h-10v10h-2v-10h-10v-2h10v-10"/>
<!-- 20 pixel cross hair at 200,150 -->
<path fill="#408000" fill-opacity=".6" transform="translate(200, 150)" d="M-1,-11h2v10h10v2h-10v10h-2v-10h-10v-2h10v-10"/>
<!-- 20 pixel cross hair at 240,180 -->
<path fill="#408000" fill-opacity=".4" transform="translate(240, 180)" d="M-1,-11h2v10h10v2h-10v10h-2v-10h-10v-2h10v-10"/>
</g>
<g font-family="SVGFreeSansASCII,sans-serif" font-size="32">
<text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</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>
|
