代码之家 › 专栏 › 技术社区 › Bjorn

为什么用余弦来计算x值,用正弦来计算y值?

graphing trigonometry geometry math javascript

Bjorn · 技术社区 · 14 年前

我试图理解这个raphael.js演示的数学原理:

检查扇区方法:

function sector(cx, cy, r, startAngle, endAngle, params) {
    var x1 = cx + r * Math.cos(-startAngle * rad),
        x2 = cx + r * Math.cos(-endAngle * rad),
        y1 = cy + r * Math.sin(-startAngle * rad),
        y2 = cy + r * Math.sin(-endAngle * rad);
    return paper.path(["M", cx, cy, "L", x1, y1, "A", r, r, 0, +(endAngle - startAngle > 180), 0, x2, y2, "z"]).attr(params);
}

这是实际演示: http://raphaeljs.com/pie.html

我的数学有点生疏,我试图理解扇形函数——给定startangle和endangle参数(每个起点和终点值在0到360之间绘制一个弧),为什么这个函数可以工作?

4 回复 | 直到 14 年前

Jon Skeet 14 年前

这完全取决于你如何对待 startAngle 和 endAngle . 看起来这是把它们当作从水平方向向右(也就是说,0的角度指向东方)和按时钟方向(所以45度的角度指向东南方向)。

通常在数学中,我们考虑从水平到右侧的角度,但逆时针方向的角度会增加…但是如果你让一个非数学家画一个角度,他们很可能会从垂直向上(即北)顺时针方向递增。这看起来像是在混合):这里没有真正的“错误”或“正确”答案——这都是一个定义问题。

由于图片很受欢迎,下面是我描述的三个系统,每个系统都假定线条是长度的。 r :

普通数学:从X轴逆时针

First diagram http://yoda.arachsys.com/blogfiles/so/angles-1.png

让街上的人画一个角度(从Y轴顺时针方向)

Second diagram http://yoda.arachsys.com/blogfiles/so/angles-2.png

此代码使用的角度(从X轴顺时针方向)

Third diagram http://yoda.arachsys.com/blogfiles/so/angles-3.png

Community CDub 8 年前

只需看看sin和cos实际上在一个圆中的意义:

如果在形成角α的圆上有一个点,cosα是点的x部分,a sinα是y部分。

这幅插图解释了为什么角度被否定。 alt文本http://i37.tinypic.com/ot3zw8.png

这意味着,您现在可以指定 顺时针的角度,这是大多数使用模拟时钟的人喜欢的。

如果你在一个形成角α的圆上有一个点,cosα是点的x部分,sinα是y部分。

这幅插图解释了为什么这个角度被否定。 alt text http://i37.tinypic.com/ot3zw8.png

这意味着,你现在可以指定 顺时针方向的 角度,大多数有模拟时钟的人喜欢。

Vladimir 14 年前

由于中心(cx,cy)和半径r的圆周上的任意点具有以下坐标(它直接根据cos和sin几何定义-相应导管和斜边的长度比):

x = cx + R*cos(a)
y = cy + R*sin(a) for  0 <= a < 2Ï

所以设置角度A的限制可以定义任意的弧。

ChrisF 14 年前

如果x增加时取0°为水平,y增加时取90°为垂直,则:

cos(0) = 1
sin(0) = 0

cos(90) = 0
sin(90) = 1

你可以用x值乘以cosine来改变x值,用y值乘以sine来改变y值。