如何计算3D空间中简单骰子的结果

Question

所以想象你有一个简单的骰子，在3D空间中有6个面孔。骰子由标准HTML元素组成，并转换为3D对象。起始位置总是相同的，面向1个向上，2个位于左侧，3个朝向您（视口）。

现在，您可以使用transform：rotateX，rotateY，rotateZ旋转骰子。出于显而易见的原因，你只能以每个90度的方向旋转骰子（负面也是如此）。现在我必须使用什么样的公式来计算最终结果。

小例子可以说：X = 3（270度），Y = 1（90度），Z = 2（180度）将导致投掷3。

你是否看到任何涉及此的逻辑因为我似乎没有完全理解它。

Answer 1

让我们将所有这些数字表示为一个对象：

 const faces = { top: 1, left: 2, front: 3, bottom: 4, right: 5, back: 6 };

现在，如果您将其旋转到右侧，例如，您可以交换所涉及的面：

const rotateToLeft = prev => ({
  top: prev.top,
  left: prev.front,
  front: prev.right,
  bottom: prev.bottom,
  right: prev.back,
  back: prev.left
});

现在你可以在每个方向上做到这一点，然后只要你需要得到结果就旋转骰子：

 let result = faces;

 for(let turn = 0; turn < 4 + Math.floor((X % 360) / 90); turn++)
   result = rotateToLeft(result);

 // repeat for y and z