如何检查鼠标指针是否在javascript中顺时针或逆时针移动

Question

我想检查鼠标是否在jtml5画布上顺时针或逆时针移动javascript，但没有得到如何继续。

UPDATE
我所做的是我采用了3个XY坐标并计算了第1点和最后点之间的角度，如本文和本文所述 。

var resultX = p2x - p1x;
var resultY = p2y - p1y;
var angle = Math.atan2(resultY, resultX) * 180 / Math.PI;

但是当我顺时针移动鼠标时，结果是正向，直到鼠标向东南方向移动，但是当鼠标向西南方向移动时顺时针方向移动，角度变为负值，这不应该发生，因为鼠标仍在顺时针方向移动。

有任何建议请。

Answer 1

我假设你知道mousemove事件，并在浏览器窗口中获取鼠标的X / Y位置？

我将采用的方法是将鼠标的最后5-6个坐标存储在一个数组中，然后执行圆拟合算法以找到正在旋转的点。

由此，可以找到从第一点到圆心到最后一点的角度，并且旋转方向基于它是正还是负。

Answer 2

首先，您可能需要一个能够为您提供两个向量之间角度的函数。 以下是编写它的方法：

两个矢量的叉积的大小等于矢量的大小乘以它们之间的角度的正弦的乘积。

设A = P1的矢量 - > P2; 设B = P2的矢量 - > P3; 设θ为角度

| A×B | = | A | | B | sin（θ）因此sin（θ）=（| A×B |）/（| A | | B |）

两个2D矢量的叉积的大小计算如下：| A×B | = Ax By - Bx Ay

并且两个矢量的点积的大小等于矢量的大小乘以它们之间的角度的余弦的乘积。 A·B = | A | | B | cos（θ）因此cos（θ）=（A·B）/（| A | | B |）

点积计算如下：A·B = Ax Bx + Ay By

| A | = sqrt（Ax Ax + Ay Ay）| B | = sqrt（Bx Bx + By By）

这给你sin（θ）和cos（θ）。

你可以调用atan2从sin（θ）和cos（θ）得到θ。 θ= atan2（sin（θ），cos（θ））

现在在代码中：

/// <summary>
/// Calculates the angle between two 2-D vectors.
/// </summary>
/// <returns>angle in radians</returns>
static double AngleBetweenVectors( double Ax, double Ay, double Bx, double By )
{
    double magA = Math.Sqrt( Ax * Ax + Ay * Ay );
    double magB = Math.Sqrt( Bx * Bx + By * By );
    double magAmagB = magA * magB;
    if( magA * magB == 0 ) throw new Exception( "Vectors must be non-zero length" );
    double sinTheta = (Ax * By - Bx * Ay) / magAmagB;
    double cosTheta = (Ax * Bx + Ay * By) / magAmagB;
    double theta = Math.Atan2( sinTheta, cosTheta );
    return theta;
}

结果是弧度。 乘以180 / Math.PI获得学位。 如果您发现由于您的坐标系而使顺时针和逆时针方向相反，则只需取消结果。

圆弧绘制功能使用x轴作为参考点，因此您需要找到矢量和x轴（1,0）之间的角度。 您必须提供开始和结束角度。 可能需要进行一些条件检查以验证电弧是否符合您想要的方向，并且您可以根据需要调整角度，使得θStart> thetaEnd或thetaStart <thetaEnd。

你也想检查这个链接