HTML5的Canvas

meteoric發表於2011-06-20

關於HTML5的基礎,前一二年就已經有很多人寫過很好的文章了。

HTML5-Canvas

關於HTML5 Canvas的基礎教程  (原文HTML5 canvas – the basics)

在一些不支援flash的裝置中,如果要使用網頁需要對一些圖表資料進行展示,Canvas能幫上大忙。

比如需要將股票價格的走勢支援ipad、iphone等移動裝置的訪問,有一個基於prototype的外掛可以滿足類似的需求,官網網址>>

還有一個站點,針對canvas開發的一套完整的api,也是很強勁,官網地址>>

 

儘管目前canvas只支援2d的圖形,而且僅支援一種圖形–矩形,但它的api是如此豐富,以致可以做出一些很吸引人的應用。

國外有一個網站,Simple 3D HTML5 canvas

有幾個例子,3D效果都很逼真:

http://sebleedelisle.com/demos/canvas3d/canvas3d2.html

http://sebleedelisle.com/demos/canvas3d/canvas3d3.html

http://sebleedelisle.com/demos/canvas3d/canvas3d4.html

 

記得部落格園裡曾經有人出一個引力遊戲PlaySpace (原文連結已經打不開了,連線是在51上發的帖子),還有人用它寫了一個塔防遊戲

 

不過dron,寫了幾個例子,我覺得是可以使用canvs去模擬的

仿 Mac Os 窗體最小化效果

工作列水面效果

越南“搖搖”

JavaScript自畫像

 

之前也在百度空間也發了一個用canvas寫的“轉盤”,點選線上預覽示例效果:



相關文章