HTML Canvas 滑鼠畫圖

我也不打算全部翻譯了…大部分也看的懂,就算看不懂,代碼也能看懂….o(╯□╰)o原諒我非常懶…很久沒寫部落格了.

——————-以下是一個簡單的例子————————————-

首先，準備個容器,也就是畫闆了。

但是，由于IE部分版本還是不支援HTML5，那我們可以借用exCanvas相容IE..

如果你不管IE使用第一種方法

在開始之前，說說怎麼做先。它包含了四個滑鼠事件和兩個方法。addClick是為了記錄滑鼠的移動點，redraw是把記錄的資料畫出來。 (提一下，由于原作者使用了jquery，是以你也要把jquery引用進來。)

當滑鼠按下時，把paint設為true，表示正在畫，滑鼠沒松開。把滑鼠點記錄下來。

當按下滑鼠的時候，滑鼠移動就把點記錄下來并畫出來。

記錄滑鼠坐标點

目前這個redraw方法是每次都清空畫闆，然後重新把所有的點都畫過，雖然效率不高，但是這樣看起來還是挺簡單的。

<a href="http://fatkun.googlecode.com/hg/javascript/canvas.html">點我看效果，趕緊點我</a>

這上面的隻是個簡單的例子啦。。。原作者還在上面代碼的基礎上加了顔色，大小，橡皮擦等功能呢~~想看的FQ去看作者部落格吧。。這年頭不會FQ還真不好意思見人。