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
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
|
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1 Tiny//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-tiny.dtd">
<!--======================================================================-->
<!--= Copyright 2002 World Wide Web Consortium, (Massachusetts =-->
<!--= Institute of Technology, Institut National de Recherche en =-->
<!--= Informatique et en Automatique, Keio University). All Rights =-->
<!--= Reserved. See http://www.w3.org/Consortium/Legal/. =-->
<!--======================================================================-->
<!-- ===================================================================== -->
<!-- -->
<!-- paths-data-01-t.svg -->
<!-- 1.1 revision by Christophe Jolif -->
<!-- -->
<!-- Test that the viewer has the basic capability to handle the 'path' -->
<!-- element and its data (d) attribute in combination with the cubic -->
<!-- Bezier curveto commands, C, c, S, s (plus Mm and Zz). -->
<!-- -->
<!-- Author : Lofton Henderson, 29-Feb-2000 (based on work -->
<!-- of Mark Sgarlato, Adobe). -->
<!-- -->
<!-- History: -->
<!-- 29-Feb-2000, LRH, Ser#1 created. -->
<!-- 12-Mar-2000, LH, fix test-framing rect; ser#2 -->
<!-- 03-Aug-2000, LH: update DOCTYPE for CR DTD, 20000802" ser# . -->
<!-- 15-Nov-2000, LH: add missing test-body-content group. -->
<!-- -->
<!-- ===================================================================== -->
<!--======================================================================-->
<!--= Note. After October 2000, revision history is kept as CVS 'commit' =-->
<!--= log messages, and therefore is no longer in the preceding preamble.=-->
<!--======================================================================-->
<svg version="1.1" baseProfile="tiny" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="svg-root" width="100%" height="100%" viewBox="0 0 480 360">
<SVGTestCase xmlns="http://www.w3.org/2000/02/svg/testsuite/description/">
<!--nav data here-->
<OperatorScript version="$Revision: 1.6 $" testname="paths-data-01-t.svg">
<Paragraph>
Test that the viewer has the basic capability to handle the 'path'
element and its data (d) attribute in combination with the cubic
Bezier curveto commands, C, c, S, s (plus Mm and Zz).
</Paragraph>
<Paragraph>
There are 8 subtests, each composed from the cubic Bezier path commands per
the label by the subtest. On-curve control points (i.e., the curve position)
are marked by small blue squares. Subtests are filled, or stroked, or
both, using simple style properties and colors.
</Paragraph>
<Paragraph>
The rendered picture should match the reference image exactly, except for possible
variations in the labelling text (per CSS2 rules).
</Paragraph>
<Paragraph>
The test uses the 'rect' element, as well as basic fill (solid primary colors),
stroke (primary color 1-pixel lines), font-family (Arial) and font-size properties.
</Paragraph>
</OperatorScript>
</SVGTestCase>
<title id="test-title">paths-data-01-t</title>
<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>
<!--======================================================================-->
<!--Content of Test Case follows... =====================-->
<!--======================================================================-->
<g id="test-body-content">
<!-- ====================================================================== -->
<!-- First Curve "X" that has subpath utilizing M, C, S, m, c, & s ======== -->
<!-- ====================================================================== -->
<text font-family="Arial" font-size="12" x="100" y="14">Cubic bezier curves drawn with commands:</text>
<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 "/>
<!-- ====================================================================== -->
<!-- Markers for path control points ===================================== -->
<!-- ====================================================================== -->
<rect x="208" y="128" width="4" height="4" fill="#4A83FF" stroke="none"/>
<rect x="108" y="78" width="4" height="4" fill="#4A83FF" stroke="none"/>
<rect x="8" y="23" width="4" height="4" fill="#4A83FF" stroke="none"/>
<rect x="8" y="128" width="4" height="4" fill="#4A83FF" stroke="none"/>
<rect x="108" y="78" width="4" height="4" fill="#4A83FF" stroke="none"/>
<rect x="208" y="23" width="4" height="4" fill="#4A83FF" stroke="none"/>
<text font-family="Arial" font-size="12" x="5" y="82">M, C, S, m, c, s</text>
<!-- ====================================================================== -->
<!-- Infinity using M, c, c, c, C & z ===================================== -->
<!-- ====================================================================== -->
<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 "/>
<!-- ====================================================================== -->
<!-- Markers for path control points ====================================== -->
<!-- ====================================================================== -->
<rect x="238" y="88" width="4" height="4" fill="#4A83FF" stroke="none"/>
<rect x="288" y="88" width="4" height="4" fill="#4A83FF" stroke="none"/>
<rect x="338" y="88" width="4" height="4" fill="#4A83FF" stroke="none"/>
<rect x="248" y="58" width="4" height="4" fill="#4A83FF" stroke="none"/>
<text font-family="Arial" font-size="12" x="253" y="50">M, c, c, c, C, z</text>
<!-- ====================================================================== -->
<!-- Horizontal line utilizing M, C & Z =================================== -->
<!-- ====================================================================== -->
<path id="Line_MCZ" fill="none" stroke="#000000" d="M80 170 C100 170 160 170 180 170Z"/>
<!-- ====================================================================== -->
<!-- Markers for path control points ====================================== -->
<!-- ====================================================================== -->
<rect x="78" y="168" width="4" height="4" fill="#4A83FF" stroke="none"/>
<rect x="178" y="168" width="4" height="4" fill="#4A83FF" stroke="none"/>
<text font-family="Arial" font-size="12" x="110" y="190">M, C, Z</text>
<!-- ====================================================================== -->
<!-- Inverted V using M, C, c & Z ========================================= -->
<!-- ====================================================================== -->
<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"/>
<!-- ====================================================================== -->
<!-- Markers for path control points ====================================== -->
<!-- ====================================================================== -->
<rect x="3" y="258" width="4" height="4" fill="#4A83FF" stroke="none"/>
<rect x="53" y="158" width="4" height="4" fill="#4A83FF" stroke="none"/>
<rect x="103" y="258" width="4" height="4" fill="#4A83FF" stroke="none"/>
<text font-family="Arial" font-size="12" x="85" y="220">M, C, c, Z</text>
<!-- ====================================================================== -->
<!-- Remembrance Ribbon using m, c & s ==================================== -->
<!-- ====================================================================== -->
<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 "/>
<!-- ====================================================================== -->
<!-- Markers for path control points ====================================== -->
<!-- ====================================================================== -->
<rect x="198" y="258" width="4" height="4" fill="#4A83FF" stroke="none"/>
<rect x="223" y="158" width="4" height="4" fill="#4A83FF" stroke="none"/>
<rect x="248" y="258" width="4" height="4" fill="#4A83FF" stroke="none"/>
<text font-family="Arial" font-size="12" x="165" y="210">m, c, s</text>
<!-- ====================================================================== -->
<!-- 90 degree arc using M & C ============================================ -->
<!-- ====================================================================== -->
<path id="Arc_MC" fill="#0000FF" stroke="#000000" d=" M 360 100 C 420 90 460 140 450 190"/>
<!-- ====================================================================== -->
<!-- Markers for path control points ====================================== -->
<!-- ====================================================================== -->
<rect x="358" y="98" width="4" height="4" fill="#4A83FF" stroke="none"/>
<rect x="448" y="188" width="4" height="4" fill="#4A83FF" stroke="none"/>
<text font-family="Arial" font-size="12" x="360" y="150">M, C</text>
<!-- ====================================================================== -->
<!-- Circle using M, c, s, s, s & z ======================================= -->
<!-- ====================================================================== -->
<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 "/>
<!-- ====================================================================== -->
<!-- Markers for path control points ====================================== -->
<!-- ====================================================================== -->
<rect x="358" y="208" width="4" height="4" fill="#4A83FF" stroke="none"/>
<rect x="322" y="244" width="4" height="4" fill="#4A83FF" stroke="none"/>
<rect x="286" y="208" width="4" height="4" fill="#4A83FF" stroke="none"/>
<rect x="322" y="172" width="4" height="4" fill="#4A83FF" stroke="none"/>
<text font-family="Arial" font-size="12" x="290" y="265">M, c, s, s, s, z</text>
<!-- ====================================================================== -->
<!-- Inverted horseshoe using m, c & z ==================================== -->
<!-- ====================================================================== -->
<path id="Horseshoe_Mcs" fill="#F0F0F0" stroke="#FF0000" d="m 360 325 c -40 -60 95 -100 80 0 z "/>
<!-- ====================================================================== -->
<!-- Markers for path control points ====================================== -->
<!-- ====================================================================== -->
<rect x="358" y="323" width="4" height="4" fill="#4A83FF" stroke="none"/>
<rect x="438" y="323" width="4" height="4" fill="#4A83FF" stroke="none"/>
<text font-family="Arial" font-size="12" x="380" y="340">m, c, z</text>
</g>
<text id="revision" x="10" y="340" font-size="40" stroke="none" fill="black">$Revision: 1.6 $</text>
<rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/>
</svg>
|
