首頁  >  文章  >  web前端  >  vml簡介_VML相關

vml簡介_VML相關

WBOY
WBOY原創
2016-05-16 12:09:372303瀏覽

VML(Vector Markup Language)
是一个最初由Microsoft开发的XML词表,现在也只有IE5.0以上版本对VML提供支持。使用VML可以在IE中绘制矢量图形,所以有人认为VML就是在IE中实现了画笔的功能。下面介绍一下VML的优点:
基于XML标准
XML是公认拥有无穷生命力的下一代网络标记语言, VML具有先天的优势,它的表示方法简单,易于扩展等等。
支持高质量的矢量图形显示
VML支持广泛的矢量图形特征,它们基于由相连接的直线和曲线描述路径。在VML中使用两个基本的元素:shape和group。这两个元素定义了VML的全部结构;shape描述一个矢量图形元素,而group用来将这些图形结合起来,这样它们可以作为一个整体进行处理。
VML规范包括大量的支持多种不同矢量图形特征的元素。下面是VML的预定义图形元素:
l Shape
l Path
l Line
l Polyline
l Curve
l Rect
l Roundrect
l Oval
l Arc
l Group
由文本构成的图像,并可集成到HTML
由于VML使用简单的文本来表示图像,这样就可用很少的字节来表示比较复杂的图像。VML与HTML兼容,通过在HTML中声明VML命名空间并声明处理函数,就可以和其他HTML元素一样使用VML元素,在客户端浏览器显示图像。VML标记里面可以定义DHTML大部分属性和事件,比如说id, name, title, onmouseover 等等。
支持交互与动画
但VML的功能不只是绘图,他还可以在图形中嵌入文本,并可实现超链,还可通过脚本语言实现一定的动画功能。

 

 

 

 

VML是The Vector Markup Language的缩写。


参考网站
MSDN:http://msdn.microsoft.com/workshop/author/vml/shape/introduction.asp

W3C:http://www.w3.org/TR/NOTE-VML

首先需要在 标签中加上如下引用

xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
...

如果没有您没有用到OFFICE的扩展功能的话,您可以忽略第二个schema。
同时,您需要在STYLE元素中注册VML和Microsoft Office Extensions

v\:* { behavior: url(#default#VML); }
o\:* { behavior: url(#default#VML); }


如果沒有您沒有用到OFFICE的擴充功能的話,您可以忽略第二個樣式的定義。

下面說說常用的幾個元素

1.Shape元素
用法:

它的常用屬性:
FillColor:圖象填充色。
標籤語法:

腳本語法:
element.fillcolor="expression"
expression=element.fillcolor

Path:指定繪畫的路徑
腳本用法:
fillcolor="red" strokecolor="red"
coordorigin="0 0 " coordsize="200 200"
style="position:relative;top:1;left:1;width:20;height:20"
path="m 1,1 l 1,200, 200,200, 200, 1 x e">

說明:用字母m(moveto指令)定義圖像初始點的座標,例子中為(1,1)
用字母l(小寫的L字母,lineto指令)開始畫線,先畫到(1,200),再畫到(200,200),再畫到(200,1)
用字母x(close指令)關閉線條
用字母e (end指令)結束
注意:每兩個數字組成一個座標

Title:滑鼠移到圖像上時的提示文字
Style:圖象的樣式
Filled:決定閉合路徑中是否需要填充(True/False)
StrokeColor:圖象路徑的顏色

StrokeColor:圖象路徑的顏色
StrokeColor
:圖象路徑的顏色StrokeColor
:圖象路徑的顏色

StrokeColor
:圖象路徑的顏色
2.Shape元素有效的子元素



TextBox
:在圖像中定義一個文字方塊

用法:

xmlns:o="urn:schemas-microsoft-com:office:office">


VML Sample


fillcolor="green"
style="position:relative;top:1;left:1;width:200;height:200"
path = "m 1,1 l 1,250, 250,500, 500,500, 500,250, 250, 1 x e"
title="test"
strokeColor="yellow">

VML


VML

TextPath

:設定文字路徑,要使用該屬性,path屬性的TextPathOK一定要為true;並且TextPath的on屬性要為true

詳細說明文擋請上參考網站查閱! ! ! 簡單的範例:
xmlns:o="urn:schemas-microsoft-com:office:office"> VML Samplefillcolor="green"style="position:relative;top:1; left:1;width:200;height:200"path = "m 1,1 l 1,250, 250,500, 500,500, 500,250, 250, 1 x e"ti="ke" yellow">VML
   
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn