1

显然我的三角有点生锈了。我怎样才能让分钟环绕时钟？

codepen [更新：忘记 codepen 不像 jsfiddle 那样版本化；这个“笔”是一项正在进行的工作，不再代表我在提出这个问题时遇到的问题]

Javascript：

var r = $('.face').width()/2;
var j = r-18;
for(var min=0; min<60; min += 5) {
  var str = min < 10 ? '0'+min : String(min);
  var x = j*Math.sin(Math.PI*2*(min/60));
  var y = j*Math.cos(Math.PI*2*(min/60));
  console.log(x);
  $('<div>',{'class':'time'})
    .text(str)
    .css({
      marginLeft: (x+r-12)+'px',
      marginTop: (-y+r-12)+'px'
    })
    .appendTo('.face');
}
4

3 回答 3

8

你所有的.timediv 都在彼此之下。给.time类绝对定位。

于 2013-09-30T19:46:21.497 回答
0

假设 min 在 0-60 之间，并记住一个圆圈有 360 度：

var degToMin = 360/60; // 6
var minDeg = min * degToMin; // this will tell us how many degrees around the circle the minutes are
var minRad = minDeg * (Math.PI/180); // convert to radians
var x = j*Math.cos(minRad); // cos is the x coord, while sin is the y coord
var y = j*Math.sin(minRad);
于 2013-09-30T19:40:50.043 回答
0

从0到360度数（0到2 pi弧度）通常从 3 点钟开始，逆时针方向。

所以我们需要反转方向使其顺时针方向旋转，逆时针旋转 90 度（pi/2弧度）使其从 12 点开始。

每个小时都经过pi/6弧度，所以小时的位置h是：

x = x_c + r cos (-h*pi/6 + pi/2)
y = y_c + r sin (-h*pi/6 + pi/2)

时钟的中心在哪里，时钟(x_c, y_c)的半径在哪里r。

于 2013-09-30T19:44:35.503 回答