|
画一个时钟#canvas{margin:200pxauto;border:1pxsolid#e9e0b5;display:block;}<script>varcanvas=document.getElementById("canvas");varctx=canvas.getContext("2d");varwidth=ctx.canvas.width;varheight=ctx.canvas.height;varr=width/2;/*canvas绘制环境*/functiondrawBackGround(ctx){/*绘制圆框，60点，数字*/ctx.save();ctx.translate(r,r);ctx.beginPath();ctx.arc(0,0,r-5,0,Math.PI*2);ctx.lineWidth=10;ctx.stroke();ctx.closePath();ctx.font="18pxArial";ctx.textBaseline="middle";ctx.textAlign="center";varhoursNumber=[3,4,5,6,7,8,9,10,11,12,1,2];/*传入的number为数组值，i为数组索引*/hoursNumber.forEach(function(number,i){varrad=2*Math.PI/12*i;varx=Math.cos(rad)*(r-30);/*cos与sin传入的是弧度值，包括rotate也是弧度，但是css中为deg*/vary=Math.sin(rad)*(r-30);ctx.fillText(number,x,y);});for(vari=0;i |
天盟APP下载
微信扫一扫访问
