VML资料.docx

1、VML资料1 VML概述 在VML里面，标记使用的是XML扩张，需要一个namespace(命名空间)，你可以使用惯用的“v”作为命名空间，使用IE5.0到IE6.0通用的定义如下: v:* Behavior: url(#default#VML) xmlns 全称就是XML NameSpace 也就是命名空间。Behavior(行为)也是IE5.0新推出的东西，它的功能非常强大，结合样式表，可以给任何HTML对象增加行为（新的属性、方法、事件），而在这里，它的用处是把命名空间“v”和系统预定义的行为VML连接。这样定义以后，你就可以使用下面的标记了，和普通的HTML标记有所区别，每个标记都增加

2、了一个命名空间： 和其他HTML元素一样，VML标记里面可以定义DHTML大部分属性和事件，比如说id，name，title，onmouseover等等。在写法上VML比较灵活，很多属性既可以写在标记里面，又可以独立出一个新的标记来表示:等同于下面的写法:当然不是所有的属性都可以写成独立的标记，常用的比如说上面的 Stroke(按我的理解可以翻译成线性)，Path，Shadow，Fill(填充)等，VML这样的方式可以理解为 shape 的属性分类，使属性更直观。 Shape 对象派生出来的一些对象，更加直接的图象，比如说 Rect(矩形)，RoundRect(圆边的矩形)，Oval(圆)，L

3、ine(线)，PolyLine(不规则折线)，Image(图形文件)等等，以后将对这些对象细细描述。2语法 VML标记是从XML衍生出来，因而采用的都是符合XML规范的标签。在标签中，属性和元素不区分大小写。True和False可以简写为t和f。2.1 shape图形 Shape是VML最基本的对象，利用它可以画出所有想要的图形。在VML中，使用的坐标并不是Document的坐标，它有自己的坐标系，这样一来，动态改变它的坐标，就可以实现放大、缩小、旋转等功能了。shape的 CoordSize 属性就是用来定义坐标的，它有两个参数，这里的2800,2800是横纵坐标被分成了2800个点，并不是

4、HTML里面默认像素。如果没有设置圆点，VML默认是0,0（左上角），当然你也可以使用CoordOrig属性设置VML的圆点坐标。 注意：定义的坐标只是相对的，真正显示的图形大小还需要 style=width:500;height:500 来定义！上面的定义后，你可用的坐标是 x(-1400到1400) y(-1400到1400) ，这样的坐标就像数学里面的坐标了，把画版分成了四个块。shape中最主要的属性是Path，它是个功能强大的画笔，语法很简单，由几个字母组成，下面详细讲述：m x,y：MoveTo把画笔移动到 (x,y)；l x,y：LineTo从当前点到(x,y)画一条线；可以给连

5、续的几个点，VML会连续画出来直到遇到 x 命令。x：Close结束一条线；e：End结束画图。shape的其他常用属性:FillColor：填充颜色，使用HTML中规定的颜色；例如：fillcolor=redFilled：是否要填充图形，如果图形不是封闭的，也会自动封闭图形进行填充。当Filled=true(默认)，fillcolor才有效果；StrokeColor：线的颜色；StrokeWeight：线的宽度；Title：当鼠标移动到该图形上的时候，显示的文字，和HTML里面的alt、tilte一样；Type：指定该图形属于那个ShapeType，ShapeType可以为VML制定模版，将

6、在以后加以描述；前面的这些属性，FillColor、Filled可以在中使用，StrokeColor、StrokeWeight可以在中使用。也可以在 Shape 或者继承Shape的对象中使用它。2.2 ShapeType定义shape的模版，在应用中可以重复使用。 定义ShapeType时需要指定id，在后面使用ShapeType需要指定对应shape的type为#arrowDown就可以使用ShapeType模版。注意： Adj属性的用法，需要与v:formulas结合起来使用。Adj中的参数顺序为#1，#2，#n，formulas中的顺序为1，2，n。2.3 Line线段用法： 线颜色、

7、风格定义可以通过v:stroke来设定。2.4 PolyLine不规则折线用法： IE5.0不支持箭头，如果设置填充为true那么对应的多边形必须是闭合才能显示填充颜色。2.5 Rect矩形用法：2.6 RoundRect圆角矩形用法： Arcsize 圆角的大小默认为0.2。2.7 Oval椭圆用法： 需要注意的是，top和left是圆的左上角坐标，width 和 height 是圆的宽和高，不是圆的半径。其圆心坐标是(left-width/2，top-height/2)。2.8 Arc弧用法： 注意： 0角度是从平常的90度开始的。2.9 Fill填充相关属性及说明：属性名称 说明 id

8、唯一编号 type 填充类型，可以是“solid | gradient | gradientradial | tile | pattern | frame”，“Tile”， “pattern”和“frame”要求必须设置Image属性。“Gradient”，“gradientradial”和“gradienttitle”要求gradient属性必须设置。 On 是否加载填充 color 填充颜色 Color2 渐变中的第二颜色 opacity 透明度 Image属性 Src 图片对应的url地址 Size 图片大小。默认为自动 Origin 与左上角相对位置作为图片的左上角。默认为图片中心点。

9、 position 外接矩形放置图片的位置。默认为“auto” alignshape 与图形对齐 渐变相关属性（gradient） colors 不同颜色在渐变中所占比例如（30% red， 70% blue） Angle 渐变起始角度 Focus 线形渐变的焦点 focussize focusposition method “none”，“linear”，“sigma”或者any 2.10 Stroke相关属性及说明：Id 唯一标识 On 是否加载样式默认为true Weight 线宽度 color 颜色 Color2 用于渐变颜色中的第二颜色 Opacity 透明度 style 样式sin

10、gle, thinthin (1:1:1), thinthick, (1:1:2) thickthin (2:1:1), thickbetweenthin (1:1:2:1:1) miterlimit 连接点处内点和外点的最大距离 joinstyle round rounded join, bevel beveled join, miter miter join，默认为“round” Endcap “flat”，“square”，“round”，默认为“round” dashstyle 线样式（“solid| dot| dash| dashdot| longdash| longdashdot|

11、 longdashdotdot”），默认为“solid” filltype 填充类型（solid, tile, pattern, frame），默认为“solid” Src imagesize imagealignshape startarrow 起始箭头风格 startarrowwidth startarrowlength endarrow 结束箭头风格 endarrowwidth endarrowlength 2.11 Path 在path中既包含了点坐标的信息也包含对应的命令信息常用的有以下命令： m 移动到指定位置。 l 从前面一点画一条线到指定的坐标位置。 c 从当前点画弧线到指定坐

12、标位置。 x 线段闭合，即从当前点与起始点建立线段连接形成闭合图形。 e 画线结束。 如path=“m 3，0 l 0，6 6，6 3，0 x e”表示的是从（3，0）点出发先画一条线到（0，6），然后再画一条线段到（3，0），x表示闭合即从（3，0）到起点再画一条线段，最后e表示画线结束本文来自CSDN博客，转载请标明出处：VML的简介2007-07-31 10:55VML的全称是Vector Markup Language(矢量可标记语言)，矢量的图形，意味着图形可以任意放大缩小而不损失图形的质量，这在制作地图上有很大用途。VML支持广泛的矢量图形特征，它们基于由相连接的直线和曲线描述路径

13、。在VML中使用两个基本的元素：shape和group。这两个元素定义了VML的全部结构；shape描述一个矢量图形元素，而group用来将这些图形结合起来，这样它们可以作为一个整体进行处理。VML规范包括大量的支持多种不同矢量图形特征的元素，包括 Shape 、 Path、Line 、 Polyline、 Curve 、Rect、Roundrect、Oval、 Arc、Group。VML常用的几个元素1.Shape元素 用法：它的常用属性：FillColor：图象填充色。标签语法：脚本语法：element.fillcolor=expressionexpression=element.fill

14、colorPath:指定绘画的路径脚本用法：说明：用字母m（moveto命令）定义图象初始点的坐标，例子中为(1,1)用字母l（小写的L字母，lineto命令）开始画线，先画到(1,200)，再画到(200,200)，再画到(200,1)用字母x（close命令）关闭线条用字母e（end命令）结束注意：每两个数字组成一个坐标Title:鼠标移动到图象上时的提示文字Style:图象的样式Filled:决定闭合路径中是否需要填充(True/False)StrokeColor:图象路径的颜色2.Shape元素有效的子元素TextBox:在图象中定义一个文本框用法：VMLTextPath:设置文字路径，要使用该属性，path属性的TextPathOK一定要为true;并且TextPath的on属性要为trueexample: v:* behavior: url(#default#VML); o:* behavior: url(#default#VML); VML Sample VML