在一个THREE.js的场景，我有一个绕父对象。这位家长有孩子，应该是在位置锁定到他们的父母的旋转，但其自身的旋转必须是独立的，不从父继承。

In a THREE.js scene, I have a parent object that rotates around. This parent has children that should be positionally locked to their parent's rotation, but their own rotation needs to be independent and not inherit from the parent.

一个简单的例子是使孩子们总是面对镜头。

A simple case would be to make the children always face the camera.

我的尝试是反转的家长在孩子的转动。那就是：

My attempt was to "invert" the rotation of the parent in the children. That is:

# render loop
render = ->
  requestAnimationFrame(render)

  # Rotate the parent
  @parent.rotation.x += 0.01
  @parent.rotation.z += 0.02

  # Attempt to invert rotation of the parent, and fail :(
  for child in @children
    child.rotation.x = -@parent.rotation.x
    child.rotation.z = -@parent.rotation.z

这天真的尝试的结果是在这里。小黄飞机是灰色的立方体的孩子，他们的方式我不希望绕...

The result of this naive attempt is here. The small yellow planes are children of the gray cube, and they rotate around in ways I wouldn't expect...

http://jsfiddle.net/b6jgS/

我要的是这些飞机是完全平方的全部时间，与多维数据集的转动而移动，但它们的旋转锁定了世界，而不是父母。

What I want is those planes to be perfect squares the whole time, moving with the rotation of the cube, but with their rotation locked to the world, and not the parent.

那么我将如何撤消父的旋转中的孩子？什么疯狂的数学我在这里丢失？

So how would I undo the rotation of the parent in the child? What crazy math am I missing here?

我知道我可以使用点精灵在这个例子中，但我心里有更复杂的需求，最终在那里点精灵也做不了。所以，我需要找出与真正的3D对象，做到这一点。的

编辑：：此的确实的单独每个轴的工作。如果家长只旋转X上，我能反转，关于孩子的X轴旋转，它就像我想要的。相同的只是Z.但是，如果我开始改变，然后双方反转X和Z它，然后获取所有松鼠。

This does work for each axis alone. If the parent only rotates on X, I can invert that on the child's X rotation and it's just like I want. Same for only Z. However, if I start to vary and then invert both X and Z it then gets all squirrely.

推荐答案

总有一招。 ： - ）

There is always a trick. :-)

您希望有一个父对象，它的位置是相对于父，但其旋转是独立于父母的孩子。

You want to have children of a parent object whose positions are relative to the parent, but whose rotations are independent of the parent.

要做到这一点最简单的方法是让虚拟Object3D对象作为母公司的孩子，然后添加带孩子到的场景的（不是父），让学生得到了他们的世界位置虚拟对象。

The easiest way to do this is to have dummy Object3D objects as children of the parent and then add the children to the scene (not the parent) and have the children get their world positions from the dummy objects.

parent                 scene
   |                     |
   --- object_1          --- child_1
   |                     |
   --- object_2          --- child_2

child_1.position 的是从 object_1 设置世界上的地位：

child_1.position is set from object_1's world position:

child.position.getPositionFromMatrix( parent.children[idx].matrixWorld )

小提琴： http://jsfiddle.net/b6jgS/1/ （铬只，显然 - 必须是CoffeeScript的事情）

Fiddle: http://jsfiddle.net/b6jgS/1/ (Chrome only, apparently-- must be a CoffeeScript thing)

作为替代方案，有一个 THREE.Gyroscope ，你可以使用，但它在计算上更密集。

As an alternative, there is a THREE.Gyroscope that you could use, but it is computationally more intensive.