标签:
<!DOCTYPE html > <html> <head> <meta charset="gb2312" /> <title>canvas 旋转</title> <script type="text/javascript" src="js1.js"></script> </head> <body onload="pageload();"> <canvas id="cnvMain" width="500" height="500"> 浏览器不支持canvas绘图操作 </canvas> </body> </html> ================================================== function $$(id){ return document.getElementById(id); } function pageload(){ var cnv=$$("cnvMain"); var cxt=cnv.getContext("2d"); cxt.fillStyle="rgb(255,0,0)"; cxt.fillRect(200,200,100,100);//画正方形 cxt.translate(200,200);//原点移动到200,200 for(var i=0;i<5;i++){ cxt.fillStyle="rgb("+50*i+","+retRndNum(2)+",23)"; cxt.rotate(0.3+0.1*i);//旋转 cxt.fillRect(0,0,100,100);//填充正方形 } //产生随机数字 function retRndNum(n){ var strRnd=""; for(var intI=0;intI<n;intI++){ strRnd+=Math.floor(Math.random()*10); } return strRnd; } }
标签:
原文地址:http://www.cnblogs.com/aicpcode/p/4266580.html