blob: 50b2be3a62791c3418fe593ca1df4036a6208402 (
plain)
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
|
<!--
Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/
-->
<svg id="svg-root"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="testmeta">
<title>SVG Filter Chains: Don't Clip Primitives in Previous Filters to Subsequent Filter Regions</title>
<link rel="copyright"
href="http://www.w3.org/Graphics/SVG/Test/Copyright"/>
<link rel="license"
href="http://www.w3.org/Consortium/Legal/2008/03-bsd-license.html"/>
<link rel="author"
title="Max Vujovic"
href="mailto:mvujovic@adobe.com"/>
<link rel="help"
href="http://dev.w3.org/fxtf/filters/#FilterPrimitiveSubRegion"/>
<link rel="match"
href="dont-clip-previous-primitives.svg" />
<metadata class="flags">namespace svg</metadata>
<desc class="assert">
In an SVG filter chain, this test verifies that a second filter's filter
region does not clip the primitives inside a first filter. If the test
passes, you should see a green square.
</desc>
</g>
<g id="test-body-content">
<!-- Use a wide filter region. -->
<filter id="f1" x="0" y="0" width="200" height="100" filterUnits="userSpaceOnUse">
<!-- Create a red square at x=100. -->
<feFlood flood-color="red" x="100" y="0" width="100" height="100"/>
<!-- Offset the red square left to x=0. -->
<feOffset dx="-100" x="0" y="0" width="200" height="100"/>
</filter>
<!--
Use a less wide filter region. The intermediate results of the previous
filter do not fit in this filter region, but that shouldn't matter. The
previous filter's intermediate results should not be affected by this
filter region. The final result of the previous filter should fit in this
filter region.
-->
<filter id="f2" x="0" y="0" width="100" height="100" filterUnits="userSpaceOnUse">
<!-- Turn the red square into a green square. -->
<feColorMatrix type="hueRotate" values="90"/>
</filter>
<rect x="0" y="0" width="100" height="100" filter="url(#f1) url(#f2)" fill="blue"/>
</g>
</svg>
|
