-
<meta name="viewport" content=" width=device-width,initial-scale=1" /> 解释: content属性值 : width:可视区域的宽度,值可为数字或关键词device-width height:同width intial-scale:页面首次被显示是可视区域的缩放级别,取值1.0则页面按实际尺寸显示,无任何缩放 maximum-scale=1.0, minimum-scale=1.0;可视区域的缩放级别, maximum-scale用户可将页面放大的程序,1.0将禁止用户放大到实际尺寸之上。 user-scalable:是否可对页面进行缩放,no 禁止缩放查看全部
-
kk查看全部
-
记笔记记笔记查看全部
-
弧度=弧长/半径查看全部
-
。。。查看全部
-
基础知识前提:对圆的角度、弧度、弧长的求值。使用js中的sin(),cos(),tan()来获取对应点坐标。查看全部
-
为什么我把分针加到时针上去,就啥都不现实了,为什么了?查看全部
-
//时针 function drawHour(hour){ ctx.beginPath(); var rad=2*Math.PI/12*hour; ctx.rotate(rad); ctx.lineWidth=6; ctx.lineCap='round';//两端样式 ctx.moveTo(0,10);// 把路径移动到画布中的指定点,不创建线条 ctx.lineTo(0,-r/2);//添加一个新点,然后在画布中创建从该点到最后指定点的线条,负轴为正 ctx.stroke(); }查看全部
-
//12个时间点 var hourNumbers=[3,4,5,6,7,8,9,10,11,12,1,2];//小时点,从起始角开始 ctx.font='18px Arial';//字体样式 ctx.textAlign='center';//左右居中 ctx.textBaseline='middle';//上下居中 hourNumbers.forEach(function(number,i){//遍历数组 var rad=2*Math.PI/12*i;//弧度 var x=Math.cox(rad)*(r-30); var y=Math.sin(rad)*(r-30); ctx.fillText(number,x,y);//按路径填充文本 }) //60个刻度点 for(var i=0;i<60;i++){ var rad=2*Math.PI/60*i; var x=Math.cos(rad)*(r-18); var y=Math.sin(rad)*(r-18); ctx.beginPath(); if(i%5==0){//整点对应的圆点 ctx.fillstyle='#000'; ctx.arc(x,y,2,0,2*Math.PI,false); }else{ ctx.fillstyle='#ccc'; ctx.arc(x,y,2,0,2*Math.PI,false); } ctx.fill();//填充路径(实心点) }查看全部
-
<style> #clock{ border:1px solid #ccc; } </style> <div> <canvas id="clock" height="200px" width="200px"></canvas> </div> <script> var dom=document.getElementById("clock"); var ctx=dom.getContext('2d');//获取dom的上下文 var width=ctx.canvas.width; var height=ctx.canvas.height; var r=width/2;//定义半径 function drawBackground(){//画圆 ctx.translate(r,r);//重新定义(0,0)的位置 ctx.beginPath();//起始一条路径 ctx.lineWidth=10;//定义圆的线条宽度为10px ctx.arc(0,0,r-5,0,2*Math.PI,false);//定义圆的路径 ctx.stroke();//绘制已定义的路径 } </script>查看全部
-
时钟内容查看全部
-
外边框圆的JS绘制查看全部
-
javascript:;查看全部
-
javascript:;查看全部
-
求角公式查看全部
举报
0/150
提交
取消