为什么使用余弦来计算x值并确定弧的y值？

Question

我正在尝试理解这个raphael.js演示的数学:

http://raphaeljs.com/pie.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之间绘制弧线),为什么这个函数有效？

Answer 1

只要看看一个圆圈中的罪和cos实际意味着什么:

如果在圆上有一个形成角度α的点,则cos alpha是点α的x部分,sin alpha是y部分.

此图解释了为什么角度被否定. 替代文字http://i37.tinypic.com/ot3zw8.png

这意味着,您现在可以指定顺时针角度,大多数具有模拟时钟的人更喜欢这种角度.

Answer 2

这一切都取决于你如何对待startAngle和endAngle.看起来这是将它们视为从水平向右开始(即0角指向东方)并沿着时钟方向(因此45度的角度指向东南方向).

通常在数学中我们考虑从水平到右边开始的角度,但是增加逆时针方向......但是如果你要求非数学家绘制一个角度,他们可能会从垂直向上(即北方向)顺时针方向对待它.这看起来像是在混合:)这里没有真正"错误"或"正确"的答案 - 这都是定义的问题.

由于图片很受欢迎,以下是我所描述的三个系统,每个系统假设线条长度为r:

正常数学:从x轴逆时针

第一张图http://yoda.arachsys.com/blogfiles/so/angles-1.png

要求街上的男人画一个角度(从y轴顺时针)

第二张图http://yoda.arachsys.com/blogfiles/so/angles-2.png

此代码使用的角度(从x轴顺时针)

第三张图http://yoda.arachsys.com/blogfiles/so/angles-3.png