HTML5学习笔记(一)canvas画图

作者: 穆乙

发布时间:2015-06-16 10:32:41

效果图

 兼容ie的两个js库

画图代码,放在head里

g1 = ctx.createRadialGradient(200,200,0,200,200,200);
g1.addColorStop(0,'rgb(255,255,255)');
g1.addColorStop(1,'rgb(220,220,220)');
ctx.fillStyle = g1;
ctx.fillRect(0,0,400,400);

ctx.translate(200,200);
ctx.save();

ctx.fillStyle = 'rgb('+(51*i)+','+(255-51*i)+',255)';

ctx.rotate(Math.PI*2/(i*6));

ctx.beginPath();
ctx.arc(0,i*30,8,0,Math.PI*2,ctx.restore();
}
}

执行代码

window.onload =

来源: