-
方法是不是很好呢?查看全部
-
通过rem设置比例,让时钟按画布大小的比例显示查看全部
-
//秒针 function drawSecond(second){ ctx.save(); ctx.fillStyle="#a45"; var rad=2*Math.PI/60*second; ctx.rotate(rad); ctx.beginPath(); ctx.moveTo(-2,15); ctx.lineTo(2,15); ctx.lineTo(1,-r+30); ctx.lineTo(-1,-r+30); ctx.fill(); ctx.restore(); } //中间的点 function drawDot(){ ctx.fillStyle="#fff"; ctx.beginPath(); ctx.arc(0,0,3,0,2*Math.PI,false); ctx.fill(); }查看全部
-
//时针 function drawHour(hour,minute){ ctx.save();//保存当前的画布状态 var rad=2*Math.PI/12*hour+2*Math.PI/12/60*minute; ctx.rotate(rad);//旋转画布 ctx.rotate(rad); ctx.lineWidth="6"; ctx.lineCap="round";//向线条的每个末端添加圆形线帽 ctx.beginPath(); ctx.moveTo(0,10);//起点 ctx.lineTo(0,-r/2+10);//连接的下一个点 ctx.stroke();//绘制路径 ctx.restore();//恢复到上一次保存的画布状态 } //分针 function drawMinute(minute){ ctx.save(); var rad=2*Math.PI/60*minute; ctx.rotate(rad); ctx.lineWidth="4"; ctx.lineCap="round"; ctx.beginPath(); ctx.moveTo(0,10); ctx.lineTo(0,-r/2); ctx.stroke(); ctx.restore(); }查看全部
-
弧度=弧长/半径 圆的弧度为 2PI 半圆的弧度为 PI 一个圆的弧长=2*PI*r 1度的弧长=2*PI*r/360 1度的弧度=2*PI/360查看全部
-
canvas画时钟查看全部
-
save(); //保存当前环境的状态 restore(); //返回之前保存过的路径状态和属性查看全部
-
font();//字体 textAlign(); //左右对齐 textBaseline(); //上下对齐查看全部
-
fillText(text,x,y,maxWidth);查看全部
-
context.arc(x,y,r,sAngle,eAngle,counterclockwise);查看全部
-
canvas1查看全部
-
弧度=弧长/半径 1个员的弧长=2πR查看全部
-
代码第一步之前查看全部
-
sin方法查看全部
-
Cannot read property 'getContext' of null, using canvas. 在自己跟着视频学习的过程中,遇到是、如上一个问题。后来百度到时因为canvas要在js之前加载,或者用一个jQuery包装起来,才能正确画出图形。但不明白为什么在这样加载,求大神支招。查看全部
举报
0/150
提交
取消