在VML繪圖中，當繪制shap的時候，網上普遍有個說法是通過調整CoordOrig可以調整坐標 系的原點位置可經過很多嘗試以後依舊沒有任何反應，當調整這個值的時候。
而且發現默認狀態下，v:shape根本沒有CoordOrig屬性（null），後來終於發現，其實坐 標系的調整是通過改變CoordSize和shap本身的style.left/style.top來調整的。
一個width和height都是400的shape類型DOM，當繪制的內容超出范圍的時候依然能夠顯示 ，沒有任何影響。
所以，實際上原點始終在DOM的左上角，不同的是，我們的繪圖區域可以超過DOM的左上角 ！！
CoordSize="400,-400" 的時候，表示DOM的右下角坐標是(400,-400), 而 DOM的左上角始終是(0,0)
所以，就得到以後右為正的X軸和上為正的Y軸， 這時再進行繪圖，就是以DOM的左上角為 原點的一個常規數學坐標系。下面是一則對line的小應用。經過改進的話可以做成一個簡單的類似貪吃蛇的游戲。使用鍵盤的左右鍵來調整方向，上下鍵調整速度
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:v="urn:schemas-microsoft-com:vml"
xmlns:o="urn:schemas-microsoft-com:office:office" lang="en">
<head>
<title>畫斜線</title>
<!--[if !mso]>
<style>
v\:*{behavior:url(#default#VML)}
</style>
<![endif]-->
<style type="text/css">
body{padding:0px;margin:0px;}
#line{position:absolute;left:0;top:0;z-Index:3;}
</style>
</head>
<body>
<v:line id="line"></v:line>
<v:PolyLine id="pLine" filled="false" Points="0,0 0,100"></v:PolyLine>
<v:shape CoordOrig="100,100" CoordSize="200,200">
</v:shape>
<script language="javascript">
var line=document.getElementById("line");
line.to="0,0";
line.from="0,0";
with(line.stroke)
{
Color="#FF0000";
Weight="1px";
EndArrow="Classic";
DashStyle="LongDashDot";
}
line=document.getElementById("pLine");
line.style.position="absolute";
with(line.stroke)
{
Color="#000";
Weight="1px";
EndArrow="Classic";
DashStyle="Solid";
}
line.Points.value="10,10 100,100 200,300 400,500";
var html="10,10";
var direction=0;
var prePoint=[10,10];
var step=5;
function Move()
{
var x=step*Math.cos(direction);
var y=step*Math.sin(direction);
var p=prePoint;
p[0]+=x;
p[1]-=y;
p[0]=Math.round(p[0]);
p[1]=Math.round(p[1]);
if(p[0]>=0&&p[1]>=0&&step>0)
{
prePoint=p;
html+=" "+prePoint[0]+","+prePoint[1];
line.Points.value=html;
}
}
window.setInterval(Move,50);
function document_KeyDown(e)
{
var e=window.event;
if(e.keyCode==37)
direction+=0.1;
else if(e.keyCode==39)
direction-=0.1;
else if(e.keyCode==38)
step=Math.min(Math.max(step+1,1),15);
else if(e.keyCode==40)
step=Math.max(step-1,0);
}
document.onkeydown=document_KeyDown;
document.body.focus();
</script>
</body>
</html>
來自BestEast的技術分享, JavaScript的奇思妙想, 拋磚引玉，希望能再激起哪位的好創 意。
在一些圖形應用上，VML極其之方便，但現如今日趨強大的非IE浏覽器使得VML幾近要退出 歷史舞台了。
在繪圖的組建邏輯上，其實SVG和VML有不少共同之處，如果哪位牛人能夠開發出一個兼容 VML和SVG的客戶端JS繪圖組件……
