canvas自由画笔基本功能demo
第一点，就是canvas怎么实现图形显示的，这个看看w3c的例子就会了
第二点，怎么获取鼠标，也就是先要获取鼠标在canvas中的位置，这里涉及到offsetLeft Top,clientX Y,getBoundingClientRect这些以前都不知道的浏览器属性和方法，建议自己写DEMO体会一下
第三点，利用canvas提供的方法来画出想要的图形，这里就涉及到一些api了 ，画线到是容易的
第四点，橡皮擦功能
ctx.save(); ctx.beginPath(); ctx.arc(x, y, 25, 0, Math.PI * 2, false);//圆形区域 ctx.clip();//剪切这部分arc区域 ctx.clearRect(0, 0, canvas.width, canvas.height)//清空区域内指定的像素，注意是指定的像素，也就是之前cilp剪切的区域 ctx.restore(); //关于save和restore W3C这么解释的：一旦剪切了某个区域，则所有之后的绘图都会被限制在被剪切的区域内（不能访问画布上的其他区域）。您也可以在使用 clip() 方法前通过使用 save() 方法对当前画布区域进行保存，并在以后的任意时间对其进行恢复（通过 restore() 方法）。
项目地址:
