ThreeJS立方体在Mesh.position.x为负数时自动旋转

Question

我是 ThreeJS 的 dummie\newbie。 :)

无论如何，我认为这是设置网格位置时 ThreeJS 的默认行为。

我正在尝试 design\replicate ThreeJS 中类似于项目工作分解结构 (WBS) 的结构。见下图。 WBS 中的所有 boxes\cubes 都是对齐的。

这就是我在 ThreeJS 中的代码所发生的情况：

我创建了一个名为 createCube 的辅助函数，它接受这样的对象作为参数：

var gestaoProjeto = createCube(
{ face1: { color: 'yellow', text: '1', textColor: 'yellow' },
  face2: { text: '2', textColor: 'blue' },
  face3: { text: '3', textColor: 'black' },
  face4: { text: '4', textColor: 'cyan' },
  face5: { color: 'red', text: 'Gestão do Projeto', textColor: 'yellow' },
  face6: { text: '6', textColor: 'gray' },
  x: -400,
  y: 125
});

我希望立方体的红色面位于 camera\user 前面，并且仅当用户与场景交互时它才随 OrbitControls 移动。正如您在上图中看到的，face1（黄色）的一部分已经显示出来并且 face5 已经旋转。

如果我这样做：

gestaoProjeto.rotation.set(-0.1,0.5,0);

它会旋转，但效果不好，我必须根据它们的位置旋转每个立方体。

是否可以实现我想要的"automagically"？

Answer 1

ThreeJS IRC Channel 的用户 bai 回答并准确无误。

他告诉我使用样本中大部分时间使用的OrthographicCamera instead of the PerspectiveCamera。

对于那些对某些背景感兴趣的人，这里有一个关于相机类型的非常好的解释：

In order for these meshes to be rendered, cameras must be placed to tell the renderer how they should be viewed. Three.js has two types of cameras, orthographic and perspective. Orthographic projections eliminate perspective, displaying all objects on the same scale, no matter how far away from the camera they are. This is useful for engineering because differing sizes due to perspective could make it difficult to distinguish the size of the object. You would recognize orthographic projections in any directions for assembling furniture or model cars. The perspective camera includes properties for its location relative to the scene and, as its name implies, can render the size of the model based on the properties’ distance from the camera. The cameras control the viewing frustum, or viewable area, of the scene. The viewing frustum can be pictured as a box defined by its near and far properties (the plane where the area starts and stops), along with the “aspect ratio” that defines the dimensions of the box. Any object that exists outside of viewing frustum space is not drawn in the scene — but is still rendered.

来源：https://www.smashingmagazine.com/2013/09/introduction-to-polygonal-modeling-and-three-js/#cameras

ThreeJS立方体在Mesh.position.x为负数时自动旋转

ThreeJS cube rotates automatically when Mesh.position.x is negative

camera

rotation

cube

three.js