javascript - Three.js - 如何设置相对于对象位置和方向的位置？
问题描述
我试图让我的第二个对象直接位于（-距离）我的第一个已旋转对象的后面。
假设我有 2 个对象：
var object1 = new THREE.Object3D();
object1.position.set(5, 10, 53);
object1.rotateX(1);
object1.rotateY(1.5);
var distance = 20; //place object2 20 units behind object1
var object2 = new THREE.Object3D();
object2.position.set( /*position object2 right behind object1 -distance */);
object2.lookAt(object1);
在这种情况下，我如何直接放置已旋转的object2后面？object1
视觉 2D 示例。不按比例
解决方案
在这个特定的用例中，您可以添加object2到object1，并简单地将object2' 位置设置为您想要的距离的单轴值，无论轴用作“后面” object1。
// given: object1, object2
// assuming: the meshes' "forward" direction is locally +Z, both "up" are +Y
scene.add( object1 )
object1.add( object2 )
object2.position.z = -distance
一些澄清：
网格的“前进”方向是局部 +Z
这对于确定“背后”的含义很重要。例如，汽车的前灯指向 +Z 方向。
两个“向上”都是+Y
这是模型定位的另一个方面。如果两个模型的“向上”方向都是 +Y，那么两者都是“直立”的。这就像说对于两辆汽车，它们的车顶都朝向 +Y 方向。
这是如何工作的：
鉴于两个网格 - 在它们的基本方向上 - 定向相同，那么您可以做的是object2相对于object1. 您可以通过创建object2的孩子来做到这一点object1，这意味着object2现在将在object1的本地空间而不是世界空间中执行其转换。这是可能Mesh的，因为它是Object3DThree.js 中的通用 3D 容器的派生词。作为一个孩子，会object2自动继承object1的转换，因此当您移动/旋转object1时，object2将随之而来。
这怎么行不通
您可以继续将孩子链接到您心中的内容，但在某些时候您可能希望使您的链中的对象之一相对于外部或全局对象执行某些操作。在您执行所需操作之前，展开转换将需要一些额外的步骤。