前两章,学了基础矩形和路径
总结方法fillRect() 和 strokeRect() 还有 fillStyle='...' 和 strokeStyle='...'
路径:创建beginPath() 和 closePath() 初始点moveTo() 和 lineTo() 填充用 fill()闭合stroke()
var canvas=$('canvas')[0];
function draw(){
if (canvas.getContext) {
var ctx=canvas.getContext('2d');
for (var i=0;i<4;i++) {
for(var j=0;j<3;j++){
ctx.beginPath()
var x=25+j*50,y=25+i*50,radius=20,startAngel=0,endAngel=Math.PI+(Math.PI * j )/ 2 ;
var anticlockwise=(i%2)==0?false:true;
ctx.arc(x,y,radius,startAngel,endAngel,anticlockwise)
if (i<=1) {
ctx.stroke();
}else{
ctx.fill()
}
}
}
}
}
图片.png
