javascript - 选择最短的旋转以对齐两个图像

我已经为这个问题苦苦挣扎了一段时间，尽管起初看起来并不难。

基本上，我在屏幕上有一个由JavaScript动态旋转的三角形。在动画的每一帧中，三角形都会尝试在“正确的方向”上旋转1度，以便其尖端指向屏幕上的另一个div，我可以使用箭头键来移动它。该三角形具有以下css属性

#triangle {
    position: absolute;
    left: x;
    top: y;
    -webkit-transform: rotate(degrees)
}

我可以使三角形的点很好地跟随div，但是我不知道如何使点始终以最短的旋转。有时，它会沿“错误”方向旋转355度，而不是向右旋转5度。

我有点卡住。有人可以帮我解决这个问题吗？

谢谢！

最佳答案

我会尝试这样的事情：

function optimal_angle(degrees) {
  degrees = degrees % 360;

  if (degrees > 180) {
    return degrees - 360;
  } else {
    return degrees;
  }
}

和一些测试：

> optimal_angle(355);
-5
> optimal_angle(-5);
-5
> optimal_angle(124373984);
104

如果您考虑一下，您可以在任何方向上旋转的最大角度是180度。因此，要“优化”角度，请删除重复的转数（degrees % 360），如果该角度大于180度，则转另一种方法。

关于javascript - 选择最短的旋转以对齐两个图像，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/11821118/