需求分析
能进行批改,就是相当于画笔
能进行画笔的撤回功能
能进行全部画笔的清除功能
可以转化画笔的颜色
画笔的实现
当按下鼠标(mousedown)记录开始点startX, startY
当移动鼠标的时候(mousemove)就获取当前的鼠标的坐标e.cpentX,
e.cpentY,获取到了当前的坐标后,与上一个点的坐标轴的左边进行连线(pneTo ),这样就能画出了一条横线了
当鼠标松开左键(mouseup)时候,就清除mousemove的函数
清除功能:讲原始的图片再次用drawImage()函数来重置
撤回功能:在每次按下鼠标那时候,用getImageData()函数获取当前的图像记录到数组里面,然后按撤回则使用putImageData()函数放在canvas
画笔的颜色:在mousemove里面改变strokeStyle笔的颜色
代码实现
移动鼠标画出线条的代码
如需转载,请注明文章出处和来源网址:http://www.divcss5.com/html/h61784.shtml