VML(矢量可标记语言)简介

　　VML相当于IE里面的画笔，能实现你所想要的图形，而且结合脚本，可以让图形产生动态的效果。VML是微软1999年9月附带IE5.0发布的，在我认为， VML其实是Word和HTML结合的产物。可以将Word文档另存为HTML，其中的文本和图片可以很容易的转换，但如果是手绘制的图形在以往的IE里面就无法解释了，如果都转换成图形文件又不太现实。于是微软把Word里面的图形控件结合到IE里面，使IE也具备了绘图功能。
　　VML的全称是Vector Markup Language(矢量可标记语言)，矢量的图形，意味着图形可以任意放大缩小而不损失图形的质量，这在制作地图上有很大用途。

╭════════════════════════════╮
║　　　　　　　　　　　　　　　　　　　　　　　　　　　　║
║　　免费的学习、交流、源码、工具网站，欢迎大家访问！　　║
║　　http://www.j2soft.cn/ 　　　　　　　　　　　　　　║
║　　ＥＭＡＩＬ：cuizm@163.com　　　　　　　　　　　　║
╰════════════════════════════╯

　　VML的元素包括：SHAPE、LINE、POLYLINE、RECT、ROUNDRECT、OVAL、IMAGE、GROUP等，用这些对象，可以在WEB页面中通过JAVASCRIPT动态生成各种图形，如：数据图表、矢量地图等。

　　刚开始学习的时候，看了帮助资料之后，觉得通过JAVASCRIPT动态生成各种图形很容易，但是真正使用的时候，遇到了各种问题，才知道，VML也不是那么好控制。其中遇到的最大的问题是加TEXTBOX文本对象（一般与矩形控件或者LINE控件结合，用TEXTBOX控件来做介绍）的时候，文字显示不出来。

　　通过自己多次的试验，终于找到了动态生成TEXTBOX对象的方法，好东西不敢独享，特总结出来，与大家共勉。代码如下：

//新建一个VML圆角矩形结点
//aStrLeft：矩形左边坐标；aStrTop：矩形顶部坐标；aStrWidth：矩形宽度；
//aStrHeight：矩形高度；aStrID：结点ID；aStrText：结点内容；aStrAlt：结点提示；
function createItem (aStrLeft, aStrTop, aStrWidth, aStrHeight, aStrID, aStrText, aStrAlt)
{
    var strRoundRect = "<vml:roundrect title='" + aStrAlt + "' id='" + aStrID
        + "' fillcolor='#EEEEEE' style='LEFT: " + aStrLeft + "px; TOP:" + aStrTop
        + "px; WIDTH: " + aStrWidth + "; POSITION: absolute; HEIGHT: " + aStrHeight
        + ";vertical-align:middle;CURSOR:hand;TEXT-ALIGN:center;z-index:1'>"
        + "</vml:roundrect>";
    var strText = "<vml:textbox id='txt" + aStrID + "' onselectstart='return false;'>"
        + "</vml:textbox>";

    var objRoundRect = document.createElement (strRoundRect);
    var objText = document.createElement (strText);

    objText.innerHTML = aStrText;
    objRoundRect.insertBefore (objText);

    document.forms[0].insertBefore (objRoundRect);
}

//新建一个Line对象
//aStrSource：Line对象的缘；aStrObject：Line对象的目标；
//（即从哪到哪画一条直线）
function createLine (aStrSource, aStrObject)
{
    var strLine = "<vml:line source='" + aStrSource + "' object='" + aStrObject + "'>"
        + "</vml:line>";
    var strStroke = "<vml:stroke endarrow='Classic'></vml:stroke>";

    var objLine = document.createElement (strLine);
    var objStroke = document.createElement (strStroke);

    objLine.insertBefore (objStroke);
    document.forms[0].insertBefore (objLine);
    drawLine ();
}

　　以上是创建圆角矩形结点（包括文字介绍）与直线对象的两个比较简单的方法。各详细的介绍，请查看下面的网站进行学习：

http://www.itlearner.com/code/vml/index.html