javascript - 如何计算旋转木马中最近 Pane 的旋转 Angular

Question

我有这个旋转木马，它使用 -webkit-transform: rotateX(rotation in deg); 进行 3D 旋转。它有 10 个 Pane ，这意味着每 36 度有一个 Pane 居中。

现在，我正在尝试创建一个在 touchend 事件上调用的“对齐”效果，将最近的 Pane 设置在前面居中。

我的问题是，根据任意旋转值，比如 -1820 度，我如何计算哪个 Pane ，或者更确切地说，最近的 Pane 在多大度数？

希望这是有道理的。一个提示将不胜感激。

Answer 1

如果我很好地理解了你的问题，你应该使用取模运算符，它基本上是除法余数，根据 wg3schools定义为百分号 %。

例子:5%2 等于 1

在你的情况下你可以做类似的事情

 var initialAngle= getAngle();  //let's say it's 1820 
 var closestPane= initialAngle%36; //which gives you 20.

现在你知道你的 Angular 相对于前一个 Angular 位置(我们称之为 A)。如果你再做一个简单的操作(36-20=16)你也知道从下面 Angular 距离。

angle before ---- A ---- angle after
            20deg   16deg

希望对你有帮助