首页 > 其他 > 详细

canvas summary

时间:2014-03-07 04:09:21      阅读:472      评论:0      收藏:0      [点我收藏+]

fill 填充颜色(实心);

stroke 填充线的颜色(空心);

fillStyle 实心的颜色;

stroke 空心,线的颜色;


rect 画矩形,fillRect画实心矩形,context.fillRect(x,y,width,height) context.strokeRect(x,y,width,height) 用来画边框;


arc 画圆形(也可以画扇型),(x坐标,y坐标,半径,起始角度(如果圆形,一般为0),结束角度(Math.PI × 2圆周率),顺时针/逆时针);


ctx.fillText("Hello!", 10, 50);绘制实心字体;

ctx.strokeText("Hello!", 10, 50);绘制空心字体;

每画完一条路径必须关闭:closePath;

每开始画一条路径或形状,必须开启:beginPath;


做动画时,经常使用ctx.clearRect(0,0,300,300);用来清除canvas的状态使之变透明,可以利用这点把多个canvas叠加,实现显示后面的canvas内容的功能;


未完待续。。



代码规范模块化

function rect(x,y,w,h) {
  ctx.beginPath();
  ctx.rect(x,y,w,h);
  ctx.closePath();
  ctx.fill();
}//每个function只做一类事情

canvas summary,布布扣,bubuko.com

canvas summary

原文:http://blog.csdn.net/u012844719/article/details/20634935

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!