上一篇,我講過,有一個日本人,小雄他做了一個非常強大的js畫布庫,能將 javascript 轉換為 Silverlight
這次要用到他的函數庫,地址在 http://www.cnblogs.com/libinqq/archive/2009/01/08/1371676.html
下面我就說下如何進行繪圖,十分簡單,我們只需要建立一個js數組,人性化的輸出介面即可(如下)。
Code
function boot() {
draw(document.getElementById('canvas'));
draw(document.getElementById('vmlcanvas'));
}
function draw(e) {
var dot =
" 11111 "+
" 111111111 "+
" 2223323 "+
" 2323332333 "+
" 23223332333"+
" 2233332222 "+
" 3333333 "+
" 221222 "+
" 2221221222 "+
"222211112222"+
"332131131233"+
"331111111133"+
" 111 111 "+
" 222 222 "+
"2222 2222";
var ary = dot.split("");
var data = [];
var i, iz;
for (i = 0, iz = ary.length; i < iz; ++i) {
switch (parseInt(ary[i]) || 0) {
case 0: data.push(""); break;
case 1: data.push("#FF3900"); break;
case 2: data.push("#AD7B00"); break;
case 3: data.push("#FFA542"); break;
}
}
uu.draw(e).scale(5, 5).icon(5, 25, 12, 15, data);
}
上面的代碼很簡單,我們繪製一個繪圖數組,下面直接分割輸出即可。
注意下 .icon(x軸,y軸,數組的寬度,數組的高度)
(這是我本人繪的)
我們將我們的視圖數組存取為一個對象,就可以多次調用,或做動畫。
瀏覽器安全色方面無需擔心, 因為這個庫相容能力很強,在IE下,它會把js 代碼轉化為 Silverlight ,如果客戶沒有安裝
Silverlight,程式會解析為VML , Firefox和Google 就更相容了因為他們本身就支援畫布元素。
如果做遊戲是首選,因為Silverlight 的速度相當不錯,而且,都是以x,y軸來抒寫,我們只要定義了畫布,就不需要html div.
因為這個畫布就是一個地區整體或控制項。