資料圖表_VML相關

來源:互聯網
上載者:User
現在我們來看看VML的一些應用。資料圖表可以說是VML的拿手好菜。繪製圖表,最重要的步驟是把資料轉換成座標。由於VML是向量的, 給資料的取值範圍有很大的自由度,因為你可以用帶小數的座標值,也可以是非常大的資料做為座標值。
在做圖表之前,必須明確一些事情,要把圖表看成一個整體,這意味著使用 Group 將 VML 包容起來;x,y 軸是在第四像限裡面的;VML的大小由 width,height 決定,而不是由coordsize決定。接下來,讓我們看看幾個經典的圖表。
曲線圖(走勢圖):看起來是曲線,其實細分起來就是一段段小折線組成的。所以我們可以選擇PolyLine來做。首先我們來畫座標軸:









也許你希望顯示座標軸上的刻度,這也很容易實現,我們可以用一個絕對位置的P來做座標,在Group裡面,使用絕對實際上是相對Group的相對定位的。座標值需要你自己調整了。因為我們畫分橫座標使用的是 px=200+73*i;(其中200是距離左邊的距離) 縱座標是 py=2800-73*i; (因為總共的高度是2800,所以要用減去)現在,把資料轉換成座標變得很容易了。 當然這裡的 i 是 0,1,2..7 ,也可以是你具體的資料,換算的時候,只需要按照比例得到座標值,比如說你的縱座標的價值是從 100,200,300,..700 相應的反應到座標上就是 px=200+73*i*1/100 (其中,i為資料值,1/100是座標值和資料的比例)


畫圖表的準備工作已經全部做好了,現在就差資料了。有了資料,把資料灌輸到 PolyLine 裡面,曲線就顯示出來了。現在我們使用一些假資料,看看上面的效果如何!點這裡顯示曲線
本節例子比較多,請訪問下頁。
  • 相關文章

    A Free Trial That Lets You Build Big!

    Start building with 50+ products and up to 12 months usage for Elastic Compute Service

    • Sales Support

      1 on 1 presale consultation

    • After-Sales Support

      24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.