计算鼠标移动的角度(单位为度)

13
我想计算鼠标移动的角度。尽管我知道你不必沿着一条直线移动鼠标,但我只是想根据起始点和终止点计算它,以创建一个漂亮的直角。

log("ANGLE: " + getAngle(x1, y1, x2, y2)); 给出了奇怪的结果:

ANGLE: 0.24035975832980774 
mouse has stopped
ANGLE: 1.334887709726425 
mouse has stopped
ANGLE: 0.2722859857950508
mouse has stopped
ANGLE: 0.3715485780567732
mouse has stopped

代码:

        $("canvas").mousemove(function(e) {                 
            getDirection(e);
            if (!set) {
                x1 = e.pageX, //set starting mouse x
                y1 = e.pageY, //set starting mouse y
                set = true;
            }   
            clearTimeout(thread);
            thread = setTimeout(callback.bind(this, e), 100);
        });

        function getAngle (x1, y1, x2, y2) {
            var distY = Math.abs(y2-y1); //opposite
            var distX = Math.abs(x2-x1); //adjacent
            var dist = Math.sqrt((distY*distY)+(distX*distX)); //hypotenuse, 
               //don't know if there is a built in JS function to do the square of a number
            var val = distY/dist;
            var aSine = Math.asin(val);
            return aSine; //return angle in degrees
        }

        function callback(e) {
            x2 = e.pageX; //new X
            y2 = e.pageY; //new Y

            log("ANGLE: " + getAngle(x1, y1, x2, y2));
            log("mouse has stopped");   
            set = false;
        }
3个回答

8

你的计算似乎是正确的,但问题在于Math.asin(val)返回弧度值。使用以下函数将其转换为角度:

Math.degrees = function(radians) {
    return radians*(180/Math.PI);
}

然后调用 Math.degrees(Math.asin(val)),它应该可以工作!


6
使用 atan2 函数可以获取完整圆中的角度。
radians = Math.atan2(y2-y1,x2-x1);

此外,您可能希望在计算时记录x1、x2、y1、y2的值,最好只有一个地方跟踪鼠标位置。目前,您每10毫秒更新一次位置(x2、y2、t2),但每次移动鼠标时都会更新位置(x1、y1、t1)。这可能会导致非常不可预测的样本组合。

1
Math.asin() 函数返回弧度角。如果乘以 180/pi,则可以得到以度为单位的答案。
此外,由于您需要大于 90 度的角度,因此应删除 Math.abs 调用,以便可以获得 aSin 的负值。

啊,糟糕。你能告诉我为什么将弧度乘以180/PI就可以得到角度吗? - user3871
这是弧度角度的定义。http://en.wikipedia.org/wiki/Radian#Conversion_between_radians_and_degrees - gcochard
我应该查一下的。最后一件事,我注意到当我在圆周上移动时,它总是以“90”的度数给出。例如:从原点移动到右上象限可能会给出0到90度的范围。从原点移动到右下象限,我期望的度数范围是270-360。我该如何解决这个问题? - user3871
由于您使用了距离的绝对值,因此您取消了方向。尝试不使用Math.abs并查看是否正常工作。 - gcochard
它只是将负数添加到度数中。 - user3871
gcochard,你知道如何用360度来表示它吗? - user3871

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接