什么是vml

2023年8月1日发(作者：)

什么是vmlVML相当于IE⾥⾯的画笔，能实现你所想要的图形，⽽且结合脚本，可以让图形产⽣动态的效果。VML是微软1999年9⽉附带IE5.0发布的，在我认为， VML其实是Word和HTML结合的产物。可以将Word⽂档另存为HTML，其中的⽂本和图⽚可以很容易的转换，但如果是⼿绘制的图形在以往的IE⾥⾯就⽆法解释了，如果都转换成图形⽂件⼜不太现实。于是微软把Word⾥⾯的图形控件结合到IE⾥⾯，使IE也具备了绘图功能。VML的全称是Vector Markup Language(⽮量可标记语⾔)，⽮量的图形，意味着图形可以任意放⼤缩⼩⽽不损失图形的质量，这在制作地图上有很⼤⽤途。为了显⽰它的强⼤，和增加你学习VML的信⼼，先给你看看⼀个VML例⼦:Hello world!Hello VML!

在VML⾥⾯，标记使⽤的是XML扩张，需要⼀个namespace(命名空间)，你可以使⽤惯⽤的“v”作为命名空间，使⽤IE5.0到IE6.0通⽤的定义如下:xmlns 全称就是XML NameSpace 也就是命名空间。Behavior(⾏为)也是IE5.0新推出的东西，它的功能⾮常强⼤，结合样式表，可以给任何HTML对象增加⾏为（新的属性、⽅法、事件），⽽在这⾥，它的⽤处是把命名空间“v”和系统预定义的⾏为VML连接。这样定义以后，你就可以使⽤下⾯的标记了，和普通的HTML标记有所区别，每个标记都增加了⼀个命名空间:和其他HTML元素⼀样，VML标记⾥⾯可以定义DHTML⼤部分属性和事件，⽐如说id,name,title,onmouseover等等。在写法上VML⽐较灵活，很多属性既可以写在标记⾥⾯，⼜可以独⽴出⼀个新的标记来表⽰:等同于下⾯的写法:当然不是所有的属性都可以写成独⽴的标记，常⽤的⽐如说上⾯的 Stroke(按我的理解可以翻译成线性)，Path，Shadow，Fill(填充)等，VML这样的⽅式可以理解为 shape 的属性分类，使属性更直观。Shape 对象派⽣出来的⼀些对象，更加直接的图象，⽐如说 Rect(矩形)，RoundRect(圆边的矩形)，Oval(圆)，Line(线)，PolyLine(不规则折线)，Image(图形⽂件)等等，以后将对这些对象细细描述。Shape是VML最基本的对象，利⽤它可以画出所有你想要的图形。在VML中，使⽤的坐标并不是Document的坐标，它有⾃⼰的坐标系，这样⼀来，动态改变它的坐标，就可以实现放⼤、缩⼩、旋转等功能了。shape的 CoordSize 属性就是⽤来定义坐标的，它有两个参数，， 这⾥的2800,2800 是横纵坐标被分成了2800个点，并不是HTML⾥⾯默认像素。如果没有设置圆点，VML默认是 0,0 （左上⾓），当然你也可以使⽤ CoordOrig 属性设置VML的圆点坐标。注意:定义的坐标只是相对的，真正显⽰的图形⼤⼩还需要 style="width:500;height:500" 来定义！上⾯的定义后，你可⽤的坐标是 x(-1400到1400) y(-1400到1400) ，这样的坐标就像数学⾥⾯的坐标了，把画版分成了四个块。在解决实际问题的时候，我发现，IE会⾃动把可见的VML图象放在相对的(0,0)位置，意思是说，上⾯两张图如果没有增加两个辅助的坐标，在IE上显⽰出来是并列的两个正⽅形。shape中最主要的属性是Path，它是个功能强⼤的画笔，语法很简单，由⼏个字母组成，下⾯详细讲述：m x,y:MoveTo把画笔移动到 (x,y)；l x,y:LineTo从当前点到(x,y)画⼀条线；可以给连续的⼏个点，VML会连续画出来直到遇到 x 命令。x:Close结束⼀条线；e:End结束画图shape的其他常⽤属性:FillColor:填充颜⾊，使⽤HTML中规定的颜⾊；例如:fillcolor=redFilled:是否要填充图形，如果图形不是封闭的，也会⾃动封闭图形进⾏填充。当Filled="true"(默认),fillcolor才有效果；StrokeColor:线的颜⾊；StrokeWeight:线的宽度；Title:当⿏标移动到该图形上的时候，显⽰的⽂字，和HTML⾥⾯的alt、tilte⼀样；Type:指定该图形属于那个ShapeType，ShapeType可以为VML制定模版，将在以后加以描述；前⾯的这些属性，FillColor、Filled可以在中使⽤，StrokeColor、StrokeWeight可以在中使⽤。也可以在 Shape 或者继承Shape的对象中使⽤它。在下⾯⼏节，将详细介绍 Shape 延伸出来的⼀些具体对象，诸如 Rect、RoundRect、Oval、Line等对象。

Line是做图中最常⽤的，它有两个特殊的属性 from 和 to ,就是起始点和终⽌点坐标。●如果要改变线的样式，LineStyle (Stroke)属性可以做到:Single(默认)，ThinThin，ThinThick，ThickBetweenThin●如果要改变线的类型，可以⽤ DashStyle(Stroke)属性:Solid(默认):见上图ShortDash:ShortDot:ShortDashDot:ShortDashDotDot:Dot:Dash:LongDash:DashDot:LongDashDot:LongDashDotDot:●在画坐标的时候，需要箭头，VML已经定义好了箭头，在Stroke体现:EndArrow 和 StartArrow 属性，⼀个是线开始的时候有箭头，另⼀个是线结束的时候有箭头。箭头的样式也有不少：EndArrow="Block":EndArrow="Classic":(这个看起来还⽐较舒服)EndArrow="Diamond":StartArrow="Oval":StartArrow="Open":PolyLine是 Line 的变形，是不规则的连续的线。它有个特殊的属性 Points ,⽤来设置每个点的坐标。例如：⼀样可以设置它的线的样式和类型以及箭头 ( IE5.0中，PolyLine不⽀持 Arrow )⽤VML画矩形，必须设置 style="width:50;height:50"，其他就没有什么特别的。在这节，顺便讲讲 shadow 对象和 TextBox对象：RoundRect顾名思义，是圆⾓的矩形，这种形状在画流程图的时候很常⽤，如果加上阴影，就更好看了：

在VML⾥⾯，True 和 False 可以简写成 T 和 F。Shadow 中的 offset 属性⽤来设置 偏移原图的 x,y 值。 on 属性⽤来决定是否显⽰阴影。在矩形中写字，要⽤到 TextBox 对象。TextBox ⽐较关键的属性是 inset(left,top,right,bottom)，意思是隔图形边的上下左右多少范围内定位⽂字：Hello world!

Hello world!

当然你也可以直接插⼊HTML代码，⽐如说插⼊⼀个

效果是⼀样的。

⽤VML画圆(Oval)是⾮常简单的，只要设置圆的⾼和宽就可以了。当然定位也是常⽤的：还要注意的是，top和left是圆的左上⾓坐标，width 和 height 是圆的宽和⾼，不是圆的半径。其圆⼼坐标是(left-width/2,top-height/2)。说到圆，不得不想到弧(arc) VML已经定义了弧对象，它有除了圆的基本性质外，两个特殊的属性startangle 和 endangle ，就是起始⾓度和结束⾓度，单位是度，⽽不是弧度：

注意到没有，0⾓度是从平常的90度开始的。

Image 对象从外部调⽤⼀个图形⽂件，只要IE能够显⽰的格式都可以。需要注意的是，VML只⽤来显⽰这张图⽚，并没有将这图⽚⽮量化，如果以后放⼤缩⼩，画质会改变的。刚刚查询 MSDN 关于VML资料的时候，左边的相关菜单已经 Unavailable 了，这是否意味着 VML 将被 Microsoft 抛弃？因为有取VML和Flash之长处的 SVG 的崛起，VML 黯然失⾊，曾经问⼀个开发过VML软件的⽼外，他都强烈建议我使⽤SVG。但我觉得 SVG固然强⼤，但它和Flash⼀样，有⾃⼰的菜单，有⾃⼰固定的区域，和别的⽹页元素结合的不太好（个⼈观点），VML还是有其⽣存意义的。不过可以肯定，在IE以后的版本，对VML都是⽀持的。

2023年8月1日发(作者：)

什么是vmlVML相当于IE⾥⾯的画笔，能实现你所想要的图形，⽽且结合脚本，可以让图形产⽣动态的效果。VML是微软1999年9⽉附带IE5.0发布的，在我认为， VML其实是Word和HTML结合的产物。可以将Word⽂档另存为HTML，其中的⽂本和图⽚可以很容易的转换，但如果是⼿绘制的图形在以往的IE⾥⾯就⽆法解释了，如果都转换成图形⽂件⼜不太现实。于是微软把Word⾥⾯的图形控件结合到IE⾥⾯，使IE也具备了绘图功能。VML的全称是Vector Markup Language(⽮量可标记语⾔)，⽮量的图形，意味着图形可以任意放⼤缩⼩⽽不损失图形的质量，这在制作地图上有很⼤⽤途。为了显⽰它的强⼤，和增加你学习VML的信⼼，先给你看看⼀个VML例⼦:Hello world!Hello VML!

在VML⾥⾯，标记使⽤的是XML扩张，需要⼀个namespace(命名空间)，你可以使⽤惯⽤的“v”作为命名空间，使⽤IE5.0到IE6.0通⽤的定义如下:xmlns 全称就是XML NameSpace 也就是命名空间。Behavior(⾏为)也是IE5.0新推出的东西，它的功能⾮常强⼤，结合样式表，可以给任何HTML对象增加⾏为（新的属性、⽅法、事件），⽽在这⾥，它的⽤处是把命名空间“v”和系统预定义的⾏为VML连接。这样定义以后，你就可以使⽤下⾯的标记了，和普通的HTML标记有所区别，每个标记都增加了⼀个命名空间:和其他HTML元素⼀样，VML标记⾥⾯可以定义DHTML⼤部分属性和事件，⽐如说id,name,title,onmouseover等等。在写法上VML⽐较灵活，很多属性既可以写在标记⾥⾯，⼜可以独⽴出⼀个新的标记来表⽰:等同于下⾯的写法:当然不是所有的属性都可以写成独⽴的标记，常⽤的⽐如说上⾯的 Stroke(按我的理解可以翻译成线性)，Path，Shadow，Fill(填充)等，VML这样的⽅式可以理解为 shape 的属性分类，使属性更直观。Shape 对象派⽣出来的⼀些对象，更加直接的图象，⽐如说 Rect(矩形)，RoundRect(圆边的矩形)，Oval(圆)，Line(线)，PolyLine(不规则折线)，Image(图形⽂件)等等，以后将对这些对象细细描述。Shape是VML最基本的对象，利⽤它可以画出所有你想要的图形。在VML中，使⽤的坐标并不是Document的坐标，它有⾃⼰的坐标系，这样⼀来，动态改变它的坐标，就可以实现放⼤、缩⼩、旋转等功能了。shape的 CoordSize 属性就是⽤来定义坐标的，它有两个参数，， 这⾥的2800,2800 是横纵坐标被分成了2800个点，并不是HTML⾥⾯默认像素。如果没有设置圆点，VML默认是 0,0 （左上⾓），当然你也可以使⽤ CoordOrig 属性设置VML的圆点坐标。注意:定义的坐标只是相对的，真正显⽰的图形⼤⼩还需要 style="width:500;height:500" 来定义！上⾯的定义后，你可⽤的坐标是 x(-1400到1400) y(-1400到1400) ，这样的坐标就像数学⾥⾯的坐标了，把画版分成了四个块。在解决实际问题的时候，我发现，IE会⾃动把可见的VML图象放在相对的(0,0)位置，意思是说，上⾯两张图如果没有增加两个辅助的坐标，在IE上显⽰出来是并列的两个正⽅形。shape中最主要的属性是Path，它是个功能强⼤的画笔，语法很简单，由⼏个字母组成，下⾯详细讲述：m x,y:MoveTo把画笔移动到 (x,y)；l x,y:LineTo从当前点到(x,y)画⼀条线；可以给连续的⼏个点，VML会连续画出来直到遇到 x 命令。x:Close结束⼀条线；e:End结束画图shape的其他常⽤属性:FillColor:填充颜⾊，使⽤HTML中规定的颜⾊；例如:fillcolor=redFilled:是否要填充图形，如果图形不是封闭的，也会⾃动封闭图形进⾏填充。当Filled="true"(默认),fillcolor才有效果；StrokeColor:线的颜⾊；StrokeWeight:线的宽度；Title:当⿏标移动到该图形上的时候，显⽰的⽂字，和HTML⾥⾯的alt、tilte⼀样；Type:指定该图形属于那个ShapeType，ShapeType可以为VML制定模版，将在以后加以描述；前⾯的这些属性，FillColor、Filled可以在中使⽤，StrokeColor、StrokeWeight可以在中使⽤。也可以在 Shape 或者继承Shape的对象中使⽤它。在下⾯⼏节，将详细介绍 Shape 延伸出来的⼀些具体对象，诸如 Rect、RoundRect、Oval、Line等对象。

Line是做图中最常⽤的，它有两个特殊的属性 from 和 to ,就是起始点和终⽌点坐标。●如果要改变线的样式，LineStyle (Stroke)属性可以做到:Single(默认)，ThinThin，ThinThick，ThickBetweenThin●如果要改变线的类型，可以⽤ DashStyle(Stroke)属性:Solid(默认):见上图ShortDash:ShortDot:ShortDashDot:ShortDashDotDot:Dot:Dash:LongDash:DashDot:LongDashDot:LongDashDotDot:●在画坐标的时候，需要箭头，VML已经定义好了箭头，在Stroke体现:EndArrow 和 StartArrow 属性，⼀个是线开始的时候有箭头，另⼀个是线结束的时候有箭头。箭头的样式也有不少：EndArrow="Block":EndArrow="Classic":(这个看起来还⽐较舒服)EndArrow="Diamond":StartArrow="Oval":StartArrow="Open":PolyLine是 Line 的变形，是不规则的连续的线。它有个特殊的属性 Points ,⽤来设置每个点的坐标。例如：⼀样可以设置它的线的样式和类型以及箭头 ( IE5.0中，PolyLine不⽀持 Arrow )⽤VML画矩形，必须设置 style="width:50;height:50"，其他就没有什么特别的。在这节，顺便讲讲 shadow 对象和 TextBox对象：RoundRect顾名思义，是圆⾓的矩形，这种形状在画流程图的时候很常⽤，如果加上阴影，就更好看了：

在VML⾥⾯，True 和 False 可以简写成 T 和 F。Shadow 中的 offset 属性⽤来设置 偏移原图的 x,y 值。 on 属性⽤来决定是否显⽰阴影。在矩形中写字，要⽤到 TextBox 对象。TextBox ⽐较关键的属性是 inset(left,top,right,bottom)，意思是隔图形边的上下左右多少范围内定位⽂字：Hello world!

Hello world!

当然你也可以直接插⼊HTML代码，⽐如说插⼊⼀个

效果是⼀样的。

⽤VML画圆(Oval)是⾮常简单的，只要设置圆的⾼和宽就可以了。当然定位也是常⽤的：还要注意的是，top和left是圆的左上⾓坐标，width 和 height 是圆的宽和⾼，不是圆的半径。其圆⼼坐标是(left-width/2,top-height/2)。说到圆，不得不想到弧(arc) VML已经定义了弧对象，它有除了圆的基本性质外，两个特殊的属性startangle 和 endangle ，就是起始⾓度和结束⾓度，单位是度，⽽不是弧度：

注意到没有，0⾓度是从平常的90度开始的。

Image 对象从外部调⽤⼀个图形⽂件，只要IE能够显⽰的格式都可以。需要注意的是，VML只⽤来显⽰这张图⽚，并没有将这图⽚⽮量化，如果以后放⼤缩⼩，画质会改变的。刚刚查询 MSDN 关于VML资料的时候，左边的相关菜单已经 Unavailable 了，这是否意味着 VML 将被 Microsoft 抛弃？因为有取VML和Flash之长处的 SVG 的崛起，VML 黯然失⾊，曾经问⼀个开发过VML软件的⽼外，他都强烈建议我使⽤SVG。但我觉得 SVG固然强⼤，但它和Flash⼀样，有⾃⼰的菜单，有⾃⼰固定的区域，和别的⽹页元素结合的不太好（个⼈观点），VML还是有其⽣存意义的。不过可以肯定，在IE以后的版本，对VML都是⽀持的。