var cvs = document.getElementById('cvs');
var ctx = cvs.getContext('2d');
// 对象矩形封装
// 构造函数
function JuXing(ctx,startX,startY,width,height,lineWidth,strokeStyle,fillStyle){
this.ctx=ctx;
this.startX=startX;
this.startY=startY;
this.width=width;
this.height=height;
this.lineWidth=lineWidth;
this.strokeStyle=strokeStyle;
this.fillStyle=fillStyle;
}
//绘制函数
JuXing.prototype.darw=function(){
this.ctx.beginPath();
this.ctx.moveTo(this.startX,this.startY);
this.ctx.lineTo(this.startX+this.width,this.startY);
this.ctx.lineTo(this.startX+this.width,this.startY+this.height);
this.ctx.lineTo(this.startX,this.startY+this.height);
this.ctx.closePath();
this.ctx.lineWidth=this.lineWidth;
this.ctx.strokeStyle=this.strokeStyle;
this.ctx.fillStyle=this.fillStyle;
this.ctx.fill();
this.ctx.stroke();
}
var jx = new JuXing(ctx,20,20,100,80,5,"blue","red");
jx.darw();
var jx2 = new JuXing(ctx,40,40,100,80,5,"yellow","pink");
jx2.darw();
Canvas矩形封装
猜你喜欢
转载自blog.csdn.net/zhuxiaobeicheng/article/details/81096382
今日推荐
周排行