Merge Chromium + Blink git repositories
[chromium-blink-merge.git] / third_party / WebKit / LayoutTests / svg / W3C-SVG-1.1 / resources / paths-data-01-f.svg
blob43d9041b78671ab81a001e8cf5f914b6e6239a76
1 <?xml version="1.0" encoding="UTF-8"?>
2 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
3 <!--======================================================================-->
4 <!--= Copyright 2002 World Wide Web Consortium, (Massachusetts =-->
5 <!--= Institute of Technology, Institut National de Recherche en =-->
6 <!--= Informatique et en Automatique, Keio University). All Rights =-->
7 <!--= Reserved. See http://www.w3.org/Consortium/Legal/. =-->
8 <!--======================================================================-->
9 <!-- ===================================================================== -->
10 <!-- -->
11 <!-- paths-data-01-f.svg -->
12 <!-- 1.1 revision by Christophe Jolif -->
13 <!-- -->
14 <!-- Test that the viewer has the basic capability to handle the 'path' -->
15 <!-- element and its data (d) attribute in combination with the cubic -->
16 <!-- Bezier curveto commands, C, c, S, s (plus Mm and Zz). -->
17 <!-- -->
18 <!-- Author : Lofton Henderson, 29-Feb-2000 (based on work -->
19 <!-- of Mark Sgarlato, Adobe). -->
20 <!-- -->
21 <!-- History: -->
22 <!-- 29-Feb-2000, LRH, Ser#1 created. -->
23 <!-- 12-Mar-2000, LH, fix test-framing rect; ser#2 -->
24 <!-- 03-Aug-2000, LH: update DOCTYPE for CR DTD, 20000802" ser# . -->
25 <!-- 15-Nov-2000, LH: add missing test-body-content group. -->
26 <!-- -->
27 <!-- ===================================================================== -->
28 <!--======================================================================-->
29 <!--= Note. After October 2000, revision history is kept as CVS 'commit' =-->
30 <!--= log messages, and therefore is no longer in the preceding preamble.=-->
31 <!--======================================================================-->
32 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="svg-root" width="480" height="360">
33 <SVGTestCase xmlns="http://www.w3.org/2000/02/svg/testsuite/description/">
34 <OperatorScript>
35 <Paragraph>
36 Test that the viewer has the basic capability to handle the 'path'
37 element and its data (d) attribute in combination with the cubic
38 Bezier curveto commands, C, c, S, s (plus Mm and Zz).
39 </Paragraph>
40 <Paragraph>
41 There are 8 subtests, each composed from the cubic Bezier path commands per
42 the label by the subtest. On-curve control points (i.e., the curve position)
43 are marked by small blue squares. Subtests are filled, or stroked, or
44 both, using simple style properties and colors.
45 </Paragraph>
46 <Paragraph>
47 The rendered picture should match the reference image exactly, except for possible
48 variations in the labelling text (per CSS2 rules).
49 </Paragraph>
50 <Paragraph>
51 The test uses the 'rect' element, as well as basic fill (solid primary colors),
52 stroke (primary color 1-pixel lines), font-family (Helvetica) and font-size properties.
53 </Paragraph>
54 </OperatorScript>
55 </SVGTestCase>
56 <title id="test-title">paths-data-01-f</title>
57 <desc id="test-desc">Test that the viewer has the basic capability to handle the 'path' element and data (d) attribute in combination with the cubic Bezier curveto, both regular and shorthand/smooth forms - C, c, S, s (along with Mm and Zz).</desc>
58 <!--======================================================================-->
59 <!--Content of Test Case follows... =====================-->
60 <!--======================================================================-->
61 <g id="test-body-content">
62 <!-- ====================================================================== -->
63 <!-- First Curve "X" that has subpath utilizing M, C, S, m, c, & s ======== -->
64 <!-- ====================================================================== -->
65 <text font-family="Helvetica" font-size="12" x="100" y="14">Cubic bezier curves drawn with commands:</text>
66 <path id="X_curve_MCSmcs" fill="#FF0000" stroke="#00C000" d=" M 210 130 C 145 130 110 80 110 80 S 75 25 10 25 m 0 105 c 65 0 100 -50 100 -50 s 35 -55 100 -55 "/>
67 <!-- ====================================================================== -->
68 <!-- Markers for path control points ===================================== -->
69 <!-- ====================================================================== -->
70 <rect x="208" y="128" width="4" height="4" fill="#4A83FF" stroke="none"/>
71 <rect x="108" y="78" width="4" height="4" fill="#4A83FF" stroke="none"/>
72 <rect x="8" y="23" width="4" height="4" fill="#4A83FF" stroke="none"/>
73 <rect x="8" y="128" width="4" height="4" fill="#4A83FF" stroke="none"/>
74 <rect x="108" y="78" width="4" height="4" fill="#4A83FF" stroke="none"/>
75 <rect x="208" y="23" width="4" height="4" fill="#4A83FF" stroke="none"/>
76 <text font-family="Helvetica" font-size="12" x="5" y="82">M, C, S, m, c, s</text>
77 <!-- ====================================================================== -->
78 <!-- Infinity using M, c, c, c, C & z ===================================== -->
79 <!-- ====================================================================== -->
80 <path id="Infinity_McccCz" fill="none" stroke="#000000" d=" M 240 90 c 0 30 7 50 50 0 c 43 -50 50 -30 50 0 c 0 83 -68 -34 -90 -30 C 240 60 240 90 240 90 z "/>
81 <!-- ====================================================================== -->
82 <!-- Markers for path control points ====================================== -->
83 <!-- ====================================================================== -->
84 <rect x="238" y="88" width="4" height="4" fill="#4A83FF" stroke="none"/>
85 <rect x="288" y="88" width="4" height="4" fill="#4A83FF" stroke="none"/>
86 <rect x="338" y="88" width="4" height="4" fill="#4A83FF" stroke="none"/>
87 <rect x="248" y="58" width="4" height="4" fill="#4A83FF" stroke="none"/>
88 <text font-family="Helvetica" font-size="12" x="253" y="50">M, c, c, c, C, z</text>
89 <!-- ====================================================================== -->
90 <!-- Horizontal line utilizing M, C & Z =================================== -->
91 <!-- ====================================================================== -->
92 <path id="Line_MCZ" fill="none" stroke="#000000" d="M80 170 C100 170 160 170 180 170Z"/>
93 <!-- ====================================================================== -->
94 <!-- Markers for path control points ====================================== -->
95 <!-- ====================================================================== -->
96 <rect x="78" y="168" width="4" height="4" fill="#4A83FF" stroke="none"/>
97 <rect x="178" y="168" width="4" height="4" fill="#4A83FF" stroke="none"/>
98 <text font-family="Helvetica" font-size="12" x="110" y="190">M, C, Z</text>
99 <!-- ====================================================================== -->
100 <!-- Inverted V using M, C, c & Z ========================================= -->
101 <!-- ====================================================================== -->
102 <path id="Inv_V_MCcZ" fill="#00C000" stroke="none" d="M5 260 C40 260 60 175 55 160 c -5 15 15 100 50 100Z"/>
103 <!-- ====================================================================== -->
104 <!-- Markers for path control points ====================================== -->
105 <!-- ====================================================================== -->
106 <rect x="3" y="258" width="4" height="4" fill="#4A83FF" stroke="none"/>
107 <rect x="53" y="158" width="4" height="4" fill="#4A83FF" stroke="none"/>
108 <rect x="103" y="258" width="4" height="4" fill="#4A83FF" stroke="none"/>
109 <text font-family="Helvetica" font-size="12" x="85" y="220">M, C, c, Z</text>
110 <!-- ====================================================================== -->
111 <!-- Remembrance Ribbon using m, c & s ==================================== -->
112 <!-- ====================================================================== -->
113 <path id="Rem_Rib_mcs" fill="none" stroke="#000000" d="m 200 260 c 50 -40 50 -100 25 -100 s -25 60 25 100 "/>
114 <!-- ====================================================================== -->
115 <!-- Markers for path control points ====================================== -->
116 <!-- ====================================================================== -->
117 <rect x="198" y="258" width="4" height="4" fill="#4A83FF" stroke="none"/>
118 <rect x="223" y="158" width="4" height="4" fill="#4A83FF" stroke="none"/>
119 <rect x="248" y="258" width="4" height="4" fill="#4A83FF" stroke="none"/>
120 <text font-family="Helvetica" font-size="12" x="165" y="210">m, c, s</text>
121 <!-- ====================================================================== -->
122 <!-- 90 degree arc using M & C ============================================ -->
123 <!-- ====================================================================== -->
124 <path id="Arc_MC" fill="#0000FF" stroke="#000000" d=" M 360 100 C 420 90 460 140 450 190"/>
125 <!-- ====================================================================== -->
126 <!-- Markers for path control points ====================================== -->
127 <!-- ====================================================================== -->
128 <rect x="358" y="98" width="4" height="4" fill="#4A83FF" stroke="none"/>
129 <rect x="448" y="188" width="4" height="4" fill="#4A83FF" stroke="none"/>
130 <text font-family="Helvetica" font-size="12" x="360" y="150">M, C</text>
131 <!-- ====================================================================== -->
132 <!-- Circle using M, c, s, s, s & z ======================================= -->
133 <!-- ====================================================================== -->
134 <path id="Circle_Mcssz" fill="#FFFF00" stroke="#000000" d="M360 210 c 0 20 -16 36 -36 36 s -36 -16 -36 -36 s 16 -36 36 -36 s 36 16 36 36 z "/>
135 <!-- ====================================================================== -->
136 <!-- Markers for path control points ====================================== -->
137 <!-- ====================================================================== -->
138 <rect x="358" y="208" width="4" height="4" fill="#4A83FF" stroke="none"/>
139 <rect x="322" y="244" width="4" height="4" fill="#4A83FF" stroke="none"/>
140 <rect x="286" y="208" width="4" height="4" fill="#4A83FF" stroke="none"/>
141 <rect x="322" y="172" width="4" height="4" fill="#4A83FF" stroke="none"/>
142 <text font-family="Helvetica" font-size="12" x="290" y="265">M, c, s, s, s, z</text>
143 <!-- ====================================================================== -->
144 <!-- Inverted horseshoe using m, c & z ==================================== -->
145 <!-- ====================================================================== -->
146 <path id="Horseshoe_Mcs" fill="#F0F0F0" stroke="#FF0000" d="m 360 325 c -40 -60 95 -100 80 0 z "/>
147 <!-- ====================================================================== -->
148 <!-- Markers for path control points ====================================== -->
149 <!-- ====================================================================== -->
150 <rect x="358" y="323" width="4" height="4" fill="#4A83FF" stroke="none"/>
151 <rect x="438" y="323" width="4" height="4" fill="#4A83FF" stroke="none"/>
152 <text font-family="Helvetica" font-size="12" x="380" y="340">m, c, z</text>
153 </g>
154 <!--======================================================================-->
155 <!--Legend and frame: Title, suite and SVG document serialization====-->
156 <!--======================================================================-->
157 <g id="test-legend" fill="black" font-family="Helvetica" font-size="10">
158 <rect x="10" y="300" width="275" height="50" fill="none" stroke="#000000"/>
159 <path fill="none" stroke="#000000" d="M10 315 h275 M205 315 v35 M10 336 h195 M205 332 h80"/>
160 <text x="25" y="311">Scalable Vector Graphics (SVG) v1.1 Conformance Suite</text>
161 <a xlink:href="copyright-documents-19990405.html">
162 <text x="12" y="347" fill="blue">Copyright 2002 W3C. All Rights Reserved.</text>
163 </a>
164 <text font-size="12" x="35" y="330">paths-data-01-f</text>
165 <text font-size="10" x="210" y="327">$Revision: 1.1 $</text>
166 <text font-size="10" x="210" y="345">Release 1.0</text>
167 <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/>
168 </g>
169 </svg>