canvas基本用法
其他
2018-08-10 05:27:06
阅读次数: 0
切记:canvas是基于状态绘制的!!!
HTML
Javascript
Context
-
// 绘制直线
context.moveTo(x,y);// 将笔尖挪到位置(x,y)
context.lintTo(x,y);// 从上一个坐标点开始连接到当前坐标点
// 绘制弧线
context.arc(cx,cy,r,sAng,eAng,anticlock=false);
// 重新开始一段路径和结束当前路径,不用成对出现
context.beginPath();// 从现在开始我要进行一段全新的绘制
context.closePath();// 绘制封闭的图形
// 状态
context.lineWidth
context.strokeStyle
context.fillStyle
// 绘制,使用的时候如果要同时使用描边和填充,那么请先使用填充,再使用描边,不然描的边会变窄
context.stroke();// 绘制线
context.fill();// 绘制填充色块
// 对当前画布上的指定矩形区域进行刷新,会用在动画的时候对屏幕进行一次清空,之后进行重绘制
context.clearRect(x,y,width,height);
// 找到该上下文绘图环境对应的画布,从而调用画布的其他属性
context.canvas
Canvas
Animation
转载自blog.csdn.net/DreamFJ/article/details/81459218