javascript + vml 實現流程設計器。

javascript. + vml 實現流程設計器。

在web中實現流程設計器，僅html無法實現畫線等。

     VML相當於IE裡面的畫筆，能實現你所想要的圖形，而且結合指令碼，可以讓圖形產生動態的效果。VML是微軟1999年9月附帶IE5.0釋出的，在我認為， VML其實是Word和HTML結合的產物。可以將Word文件另存為HTML，其中的文字和圖片可以很容易的轉換，但如果是手繪製的圖形在以往的IE裡面就無法解釋了，如果都轉換成圖形檔案又不太現實。於是微軟把Word裡面的圖形控制元件結合到IE裡面，使IE也具備了繪圖功能。
     VML的全稱是Vector Markup Language(向量可標記語言)，向量的圖形，意味著圖形可以任意放大縮小而不損失圖形的質量，這在製作地圖上有很大用途。顯然只有IE支援。

 此例使用vml實現。

vml 畫線段：

    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 畫矩形：

用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程式碼，比如說插入一個