1:shape多边型 - 专用属性
属性名 | 默认值 | 值类型/范围 | Dhtml访问 | 用途 |
path | m0,0 l e | command | path.value | 描述多边形的形状 |
type | null | #ShapeTypeName | 暗示引用的shapetype模版名称 |
<HTML xmlns:v><STYLE>v\:*{behavior:url(#default#VML);}</STYLE><BODY bgcolor="#eeeeee">
<v:shape style="Z-INDEX:1;LEFT:71;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 l30,-30 e"/>
<v:shape style="Z-INDEX:1;LEFT:171;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 l30,-30,60,0 e"/>
<v:shape style="Z-INDEX:1;LEFT:271;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 l30,-30,60,0,0,0 e"/>
<v:shape style="Z-INDEX:1;LEFT:371;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="f" strokecolor="blue" path="m0,0 l30,30,60,0,0,0 e"/>
<v:shape style="Z-INDEX:1;LEFT:471;WIDTH:50;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="f" strokecolor="blue" path="m0,0 l30,30,60,0,0,0 e"/>
<v:shape style="Z-INDEX:1;LEFT:571;WIDTH:2000;POSITION:absolute;TOP:225;HEIGHT:2000" coordsize="1000,1000" filled="t" strokecolor="blue" path="m0,0 l30,30,60,0,0,0 e"/>
<v:shape style="Z-INDEX:1;LEFT:571;WIDTH:5000;POSITION:absolute;TOP:300;HEIGHT:5000" coordsize="1000,1000" filled="t" strokecolor="blue" path="m0,0 l30,30,60,0,0,0 e"/>
<v:shape style="Z-INDEX:1;LEFT:71;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 l30,-30 e"/>
<v:shape style="Z-INDEX:1;LEFT:171;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 l30,-30,60,0 e"/>
<v:shape style="Z-INDEX:1;LEFT:271;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 l30,-30,60,0,0,0 e"/>
<v:shape style="Z-INDEX:1;LEFT:371;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="f" strokecolor="blue" path="m0,0 l30,30,60,0,0,0 e"/>
<v:shape style="Z-INDEX:1;LEFT:471;WIDTH:50;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="f" strokecolor="blue" path="m0,0 l30,30,60,0,0,0 e"/>
<v:shape style="Z-INDEX:1;LEFT:571;WIDTH:2000;POSITION:absolute;TOP:225;HEIGHT:2000" coordsize="1000,1000" filled="t" strokecolor="blue" path="m0,0 l30,30,60,0,0,0 e"/>
<v:shape style="Z-INDEX:1;LEFT:571;WIDTH:5000;POSITION:absolute;TOP:300;HEIGHT:5000" coordsize="1000,1000" filled="t" strokecolor="blue" path="m0,0 l30,30,60,0,0,0 e"/>
<HTML xmlns:v><STYLE>v\:*{behavior:url(#default#VML);}</STYLE><BODY bgcolor="#eeeeee">
<v:shape style="Z-INDEX:1;LEFT:71;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 l30,-30 e"/>
<v:shape style="Z-INDEX:1;LEFT:171;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 l30,-30,60,0 e"/>
<v:shape style="Z-INDEX:1;LEFT:271;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 l30,-30,60,0,0,0 e"/>
<v:shape style="Z-INDEX:1;LEFT:371;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="f" strokecolor="blue" path="m0,0 l30,30,60,0,0,0 e"/>
<v:shape style="Z-INDEX:1;LEFT:71;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 l30,-30 e"/>
<v:shape style="Z-INDEX:1;LEFT:171;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 l30,-30,60,0 e"/>
<v:shape style="Z-INDEX:1;LEFT:271;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 l30,-30,60,0,0,0 e"/>
<v:shape style="Z-INDEX:1;LEFT:371;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="f" strokecolor="blue" path="m0,0 l30,30,60,0,0,0 e"/>
<HTML xmlns:v><STYLE>v\:*{behavior:url(#default#VML);}</STYLE><BODY>
<v:shape style="Z-INDEX:3180;LEFT:300px;WIDTH:100px;POSITION:absolute;TOP:179px;HEIGHT:100px" coordsize="100,100" filled="f" fillcolor="white" strokecolor="black" strokeweight=".75pt" path=" m0,0 l0,0,-5,16,-6,18,-7,20,-7,21,-8,21,-9,23,-10,24,-11,25,-12,26,-13,27,-15,28,-18,29,-21,31,-23,32,-25,33,-26,34,-25,31,-22,28,-19,24 -16,20,-12,15,-9,11,-6,7,-3,4,0,2,3,0,4,-2,6,-3,14,-9,15,-11,16,-12,17,-13,18,-11,18,-9,18,-5,18,-1,18,4,18,9,20,15 21,19,24,26,26,28,27,29,28,30,30,31,31,31,33,31,35,32,35,33,36,31,34,29,30,24,22,19,15,14,2,8,-2,6,-3,5,-4,5,-5,4 -5,3,-5,4,-3,6,3,10,9,14,13,18,18,23,22,27,27,31,28,33,30,34,31,33,31,31,31,27,29,23,27,19,24,16,22,14,20,11,18,9 17,9,15,10,13,12,10,15,7,18,5,21,2,24,-1,25,-2,27,-3,29 e"/>
<v:shape style="Z-INDEX:3185;LEFT:360px;WIDTH:100px;POSITION:absolute;TOP:173px;HEIGHT:100px" coordsize="100,100" filled="f" fillcolor="white" strokecolor="blue" strokeweight=".75pt" path=" m0,0 l0,0,34,-8,33,-7,31,-4,29,-2,27,1,25,3,23,4,21,6,19,7,19,8,18,8,17,9,16,9,14,10,12,10,9,11,6,12,4,12,8,12 13,12,19,9,23,8,27,7,29,7,31,7,29,9,25,13,20,16,16,20,11,24,7,26,6,27,8,27,12,27,17,26,23,25,27,23,30,21,31,20 32,20,33,19,33,18,34,18,36,20,38,23,39,25,41,28,42,30,43,32 e"/>
<v:shape style="Z-INDEX:3186;LEFT:452px;WIDTH:100px;POSITION:absolute;TOP:160px;HEIGHT:100px" coordsize="100,100" filled="f" fillcolor="white" strokecolor="red" strokeweight=".75pt" path=" m0,0 l0,0,-12,17,-13,18,-11,16,-7,14,-2,12,3,9,9,6,15,5,20,4,22,3,24,2,22,5,20,7,15,10,14,11,11,14,7,17,4,19,1,20 1,21,0,21,-2,22,-2,23,-4,24,-1,23,3,21,11,19,18,17,23,15,29,14,30,14,31,14,28,14,24,14,21,14,17,14,14,13,13,13,11,12 10,15,10,17,10,21,10,24,10,25,10,26,11,24,13,22,15,18,15,15,15,12,16,11,16,10,17,10,18,11,18,13,18,15,18,16,18,18,18,19 18,20,19,18,20,17,22,15,23,12,24,11,24,13,24,14,24,17,24,20,22,22,19,24,15,27,9,30,2,31,-3,33,-7,34,-11,36,-13,37,-10,34 -3,31,5,26,12,23,20,19,25,17,29,15,26,16,21,19,15,23,9,28,3,33,-2,36,-7,40,-8,41,-4,38,0,36,6,34,10,32,11,30,13,29 14,31,14,34,11,38,4,43,-5,49,-16,55,-28,60,-37,64,-43,65,-42,65,-39,63,-33,58,-27,56,-20,51,-12,49,-7,45,1,43,6,39,9,38,10,37 11,36,11,35,12,35,14,34,15,33,16,33,13,34,10,35,5,38,3,40,2,41,2,42,3,43,4,43,6,43,8,43,12,43,16,42,22,40,27,37 33,34,36,33,39,31,39,29,39,28,39,26,38,25,36,24,35,24,34,24,33,25,33,26,32,27,32,29,32,32,32,35,32,39,32,42,32,44,32,47 33,50,35,54,37,58,39,62,41,66,42,69 e"/>
<v:shape style="Z-INDEX:3187;LEFT:327px;WIDTH:100px;POSITION:absolute;TOP:277px;HEIGHT:100px" coordsize="100,100" filled="t" fillcolor="yellow" strokecolor="black" strokeweight=".75pt" path=" m0,0 l0,0,9,0,20,-9,19,20,10,10,0,10,0,0 e"/>
<v:shape style="Z-INDEX:3180;LEFT:300px;WIDTH:100px;POSITION:absolute;TOP:179px;HEIGHT:100px" coordsize="100,100" filled="f" fillcolor="white" strokecolor="black" strokeweight=".75pt" path=" m0,0 l0,0,-5,16,-6,18,-7,20,-7,21,-8,21,-9,23,-10,24,-11,25,-12,26,-13,27,-15,28,-18,29,-21,31,-23,32,-25,33,-26,34,-25,31,-22,28,-19,24 -16,20,-12,15,-9,11,-6,7,-3,4,0,2,3,0,4,-2,6,-3,14,-9,15,-11,16,-12,17,-13,18,-11,18,-9,18,-5,18,-1,18,4,18,9,20,15 21,19,24,26,26,28,27,29,28,30,30,31,31,31,33,31,35,32,35,33,36,31,34,29,30,24,22,19,15,14,2,8,-2,6,-3,5,-4,5,-5,4 -5,3,-5,4,-3,6,3,10,9,14,13,18,18,23,22,27,27,31,28,33,30,34,31,33,31,31,31,27,29,23,27,19,24,16,22,14,20,11,18,9 17,9,15,10,13,12,10,15,7,18,5,21,2,24,-1,25,-2,27,-3,29 e"/>
<v:shape style="Z-INDEX:3185;LEFT:360px;WIDTH:100px;POSITION:absolute;TOP:173px;HEIGHT:100px" coordsize="100,100" filled="f" fillcolor="white" strokecolor="blue" strokeweight=".75pt" path=" m0,0 l0,0,34,-8,33,-7,31,-4,29,-2,27,1,25,3,23,4,21,6,19,7,19,8,18,8,17,9,16,9,14,10,12,10,9,11,6,12,4,12,8,12 13,12,19,9,23,8,27,7,29,7,31,7,29,9,25,13,20,16,16,20,11,24,7,26,6,27,8,27,12,27,17,26,23,25,27,23,30,21,31,20 32,20,33,19,33,18,34,18,36,20,38,23,39,25,41,28,42,30,43,32 e"/>
<v:shape style="Z-INDEX:3186;LEFT:452px;WIDTH:100px;POSITION:absolute;TOP:160px;HEIGHT:100px" coordsize="100,100" filled="f" fillcolor="white" strokecolor="red" strokeweight=".75pt" path=" m0,0 l0,0,-12,17,-13,18,-11,16,-7,14,-2,12,3,9,9,6,15,5,20,4,22,3,24,2,22,5,20,7,15,10,14,11,11,14,7,17,4,19,1,20 1,21,0,21,-2,22,-2,23,-4,24,-1,23,3,21,11,19,18,17,23,15,29,14,30,14,31,14,28,14,24,14,21,14,17,14,14,13,13,13,11,12 10,15,10,17,10,21,10,24,10,25,10,26,11,24,13,22,15,18,15,15,15,12,16,11,16,10,17,10,18,11,18,13,18,15,18,16,18,18,18,19 18,20,19,18,20,17,22,15,23,12,24,11,24,13,24,14,24,17,24,20,22,22,19,24,15,27,9,30,2,31,-3,33,-7,34,-11,36,-13,37,-10,34 -3,31,5,26,12,23,20,19,25,17,29,15,26,16,21,19,15,23,9,28,3,33,-2,36,-7,40,-8,41,-4,38,0,36,6,34,10,32,11,30,13,29 14,31,14,34,11,38,4,43,-5,49,-16,55,-28,60,-37,64,-43,65,-42,65,-39,63,-33,58,-27,56,-20,51,-12,49,-7,45,1,43,6,39,9,38,10,37 11,36,11,35,12,35,14,34,15,33,16,33,13,34,10,35,5,38,3,40,2,41,2,42,3,43,4,43,6,43,8,43,12,43,16,42,22,40,27,37 33,34,36,33,39,31,39,29,39,28,39,26,38,25,36,24,35,24,34,24,33,25,33,26,32,27,32,29,32,32,32,35,32,39,32,42,32,44,32,47 33,50,35,54,37,58,39,62,41,66,42,69 e"/>
<v:shape style="Z-INDEX:3187;LEFT:327px;WIDTH:100px;POSITION:absolute;TOP:277px;HEIGHT:100px" coordsize="100,100" filled="t" fillcolor="yellow" strokecolor="black" strokeweight=".75pt" path=" m0,0 l0,0,9,0,20,-9,19,20,10,10,0,10,0,0 e"/>
1:shapetype模版 - 实例讲解
<HTML xmlns:v><STYLE>v\:*{behavior:url(#default#VML);}</STYLE><BODY>
<v:ShapeType id="m1" coordsize="1000 1000" fillcolor="yellow">
<v:Path v="m0,0 l30,-30,60,0,0,0 e"/>
</v:ShapeType>
<v:Shape style="Z-INDEX:1;LEFT:271;WIDTH:1000;POSITION:absolute;TOP:225;HEIGHT:1000" type="#m1"/>
<v:Shape style="Z-INDEX:1;LEFT:371;WIDTH:2600;POSITION:absolute;TOP:225;HEIGHT:4600" type="#m1"/>
<v:Shape style="Z-INDEX:1;LEFT:271;WIDTH:1000;POSITION:absolute;TOP:300;HEIGHT:1000" type="#m1" fillcolor="red"/>
<v:ShapeType id="m1" coordsize="1000 1000" fillcolor="yellow">
<v:Path v="m0,0 l30,-30,60,0,0,0 e"/>
</v:ShapeType>
<v:Shape style="Z-INDEX:1;LEFT:271;WIDTH:1000;POSITION:absolute;TOP:225;HEIGHT:1000" type="#m1"/>
<v:Shape style="Z-INDEX:1;LEFT:371;WIDTH:2600;POSITION:absolute;TOP:225;HEIGHT:4600" type="#m1"/>
<v:Shape style="Z-INDEX:1;LEFT:271;WIDTH:1000;POSITION:absolute;TOP:300;HEIGHT:1000" type="#m1" fillcolor="red"/>
1:shape曲线 - 详解 也许你会问我:“shape你不是说是多边形么?怎么又成了曲线?”,其实,shape翻译中文的意思即是“形状”,也就是说它能绘制圆形、矩形、圆角矩形、多边型、甚至于曲线!等等形状……,不过它的形状用标记参数描述起来很复杂,而且VML又有专门用于设计圆形oval、矩形rect、圆角矩形roundrect、曲线curve、多边形polyline的标记。 我是挑选了相对较复杂、有一定缺陷(像不支持CSS的width、height定义宽高度)的polyline(多边形)做写照,在前面章节内讲解shape绘制多边形的例子(你发现,跟polyline绘制出的效果差不多吧?) 说到这里,你不会骂我错教了你吧?其实那,这也就是我取名《VML极道教程》所谓的“极道”特征之一。让你循序渐进、让你掌握知识、让你不知不觉间已有很大的长进。而你长进到此时,在突然告诉你其实XX标记还有更深层的知识,使你不至于一开始就接触这些难于理解、难于学习的“深层知识”。好了,现在就告诉你shape怎么绘制曲线
<HTML xmlns:v><STYLE>v\:*{behavior:url(#default#VML);}</STYLE><BODY>
<v:shape style="Z-INDEX:1;LEFT:100;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 c130,-90,30,90,150,180 e"/>
<v:shape style="Z-INDEX:1;LEFT:271;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 c130,-90,30,90,160,0 e"/>
<v:shape style="Z-INDEX:1;LEFT:500;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 c130,-90,30,90,160,0,-80,50,30,190,220,-50 x e"/>
<v:shape style="Z-INDEX:1;LEFT:350;WIDTH:100;POSITION:absolute;TOP:400;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 l50,-60,100,0,50,60,0,0 c-130,-90,-30,90,130,180 e"/>
<v:shape style="Z-INDEX:1;LEFT:100;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 c130,-90,30,90,150,180 e"/>
<v:shape style="Z-INDEX:1;LEFT:271;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 c130,-90,30,90,160,0 e"/>
<v:shape style="Z-INDEX:1;LEFT:500;WIDTH:100;POSITION:absolute;TOP:225;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 c130,-90,30,90,160,0,-80,50,30,190,220,-50 x e"/>
<v:shape style="Z-INDEX:1;LEFT:350;WIDTH:100;POSITION:absolute;TOP:400;HEIGHT:100" coordsize="100,100" filled="t" fillcolor="white" path="m0,0 l50,-60,100,0,50,60,0,0 c-130,-90,-30,90,130,180 e"/>
字母 | 名称 | 参数序列 *代表支持延伸 | 说明 |
m | moveto | 2 | Start a new sub-path at the given (x,y) coordinate |
l | lineto | 2* | Draw a line from the current point to the given (x,y) coordinate which becomes the new current point. A number of coordinate pairs may be specified to form a polyline. |
c | curveto | 6* | Draw a cubic bézier curve from the current point to the coordinate given by the final two parameters, the control points given by the first four parameters. The current point becomes the end point of the bézier. |
x | close | 0 | Close the current sub-path by drawing a straight line from the current point to the original moveto point. |
e | end | 0 | End the current set of sub-paths. A given set of sub-paths (as delimited by end) is filled using eofill. Subsequent sets of sub-paths are filled independently and superimposed on existing ones. |
t | rmoveto | 2* | Start a new sub-path at the coordinate (cpx+x, cpy+y). |
r | rlineto | 2* | Draw a line from the current point to the given relative coordinate (cpx+x, cpy+y). |
v | rcurveto | 6* | Cubic bézier curve using the given coordinate relative to the current point. |
nf | nofill | 0 | The current set of sub-paths (delimited by end - e) will not be filled. |
ns | nostroke | 0 | The current set of sub-paths (delimited by end - e) will not be filled. |
ae | angleellipseto | 6* | center (x,y) size(w,h) start-angle, end-angle. Draw a segment of an ellipse as describes using these parameters. A straight line is drawn from the current point to the start point of the segment. |
al | angleellipse | 6* | Same as angleellipseto except that there is an implied moveto the starting point of the segment. |
at | arcto | 8* | left, top, right, bottom start(x,y) end(x,y). The first four values define the bounding box of an ellipse. The last four define two radial vectors. A segment of the ellipse is drawn which starts at the angle defined by the start radius vector and ends at the angle defined by the end vector. A straight line is drawn from the current point to the start of the arc. The arc is always drawn in a counterclockwise direction. |
ar | arc | 8* | left, top, right, bottom start(x,y) end(x,y). Same as arcto however a new sub-path is started by an implied moveto the start point of the arc. |
wa | clockwisearcto | 8* | left, top, right, bottom start(x,y) end(x,y). Same as arcto but the arc is drawn in a clockwise direction. |
wr | clockwisearc | 8* | left, top, right, bottom start(x,y) end(x,y). Same as arc but the arc is drawn in a clockwise direction |
qx | ellipticalqaudrantx | 2* | end(x,y). A quarter ellipse is drawn from the current point to the given end point. The elliptical segment is initially tangential to a line parallel to the x-axis. (i.e. the segment starts out horizontal) |
qy | ellipticalquadranty | 2* | end(x,y). Same as ellipticalquadrantx except that the elliptical segment is initially tangential to a line parallel to the y-axis. (i.e. the segment starts out vertical) |
qb | quadraticbezier | 2+2* | (controlpoint(x,y))*, end(x,y) Defines one or more quadratic bézier curves by means of control points and an end point. Intermediate (on-curve) points are obtained by interpolation between successive control points as in the OpenType font specification. The sub-path need not be started in which case the sub-path will be closed. In this case the last point of the sub-path defines the start point of the quadratic bézier. |
属性名 | 默认值 | 值类型/范围 | 用途 |
from | null | Vector2D | 描述曲线起点偏移XY交接点位置 |
control1 | null | Vector2D | 描述曲线的第一个曲度 |
control2 | null | Vector2D | 描述曲线的第二个曲度 |
to | null | Vector2D | 描述曲线偏移from的X2Y2终点 |
<HTML xmlns:v><STYLE>v\:*{behavior:url(#default#VML);}</STYLE><BODY>
<v:curve style="Z-INDEX:1;LEFT:300;POSITION:absolute;TOP:200" from="0,0" to="150px,0px" strokecolor="green"/>
<v:curve style="Z-INDEX:1;LEFT:300;POSITION:absolute;TOP:200" from="0,0" to="150px,0px" strokecolor="green"/>
<HTML xmlns:v><STYLE>v\:*{behavior:url(#default#VML);}</STYLE><BODY>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:100" to="150px,0px" strokecolor="green" control1="100,50"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:200" to="150px,0px" strokecolor="green" control1="150px,50px"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:300" to="150px,0px" strokecolor="green" control1="0,50"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:400" to="150px,0px" strokecolor="green" control1="-50,50"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:100" to="150px,0px" strokecolor="green" control1="100,50"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:200" to="150px,0px" strokecolor="green" control1="150px,50px"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:300" to="150px,0px" strokecolor="green" control1="0,50"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:400" to="150px,0px" strokecolor="green" control1="-50,50"/>
<HTML xmlns:v><STYLE>v\:*{behavior:url(#default#VML);}</STYLE><BODY>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:100" to="150px,0px" strokecolor="green" control2="100,50"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:200" to="150px,0px" strokecolor="green" control2="150px,50px"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:300" to="150px,0px" strokecolor="green" control2="0,50"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:400" to="150px,0px" strokecolor="green" control2="-50,50"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:100" to="150px,0px" strokecolor="green" control2="100,50"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:200" to="150px,0px" strokecolor="green" control2="150px,50px"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:300" to="150px,0px" strokecolor="green" control2="0,50"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:400" to="150px,0px" strokecolor="green" control2="-50,50"/>
<HTML xmlns:v><STYLE>v\:*{behavior:url(#default#VML);}</STYLE><BODY bgcolor="#eeeeee">
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:100" to="150px,0px" fillcolor="yellow" control1="75,50" control2="75,-50"/>
<v:curve style="Z-INDEX:1;LEFT:350;POSITION:absolute;TOP:100" to="0,150px" control1="50,75" control2="-50,75"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:300" to="150px,0px" filled='f' control1="75,150" control2="75,-150"/>
<v:curve style="Z-INDEX:1;LEFT:300;POSITION:absolute;TOP:300" to="150px,0px" fillcolor="green" control1="110,150" control2="110,-150"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:500" to="150px,0px" strokeweight=2 control1="300,150" control2="300,0"/>
<v:curve style="Z-INDEX:1;LEFT:500;POSITION:absolute;TOP:500" to="150px,0px" fillcolor="blue" stroked=f control1="-110,-150" control2="-110,-150"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:100" to="150px,0px" fillcolor="yellow" control1="75,50" control2="75,-50"/>
<v:curve style="Z-INDEX:1;LEFT:350;POSITION:absolute;TOP:100" to="0,150px" control1="50,75" control2="-50,75"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:300" to="150px,0px" filled='f' control1="75,150" control2="75,-150"/>
<v:curve style="Z-INDEX:1;LEFT:300;POSITION:absolute;TOP:300" to="150px,0px" fillcolor="green" control1="110,150" control2="110,-150"/>
<v:curve style="Z-INDEX:1;LEFT:100;POSITION:absolute;TOP:500" to="150px,0px" strokeweight=2 control1="300,150" control2="300,0"/>
<v:curve style="Z-INDEX:1;LEFT:500;POSITION:absolute;TOP:500" to="150px,0px" fillcolor="blue" stroked=f control1="-110,-150" control2="-110,-150"/>