首页 > 代码库 > 坐标轴的平移和旋转
坐标轴的平移和旋转
<!DOCTYPE html ><html><head> <meta charset="gb2312" /> <title>canvas 旋转</title> <script type="text/javascript" src="http://www.mamicode.com/js1.js"></script></head><body onl oad="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; } }
坐标轴的平移和旋转
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。