6

THREE.js シーンには、回転する親オブジェクトがあります。この親には、親の回転に位置的にロックする必要がある子がありますが、独自の回転は独立している必要があり、親から継承する必要はありません。

簡単な例としては、子供たちを常にカメラの方に向けさせるというものがあります。

私の試みは、子の親の回転を「反転」することでした。あれは:

# 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

この素朴な試みの結果がここにあります。小さな黄色い飛行機は灰色の立方体の子で、思いもよらない方向に回転します...

http://jsfiddle.net/b6jgS/

私が望むのは、これらの平面が常に完全な正方形であり、立方体の回転に合わせて移動しますが、回転は親ではなくワールドにロックされることです。

では、子の親の回転を元に戻すにはどうすればよいでしょうか? ここで私が見逃しているクレイジーな数学は何ですか?

この例ではポイント スプライトを使用できることはわかっていますが、最終的にはポイント スプライトではうまくいかない、より複雑なニーズを念頭に置いています。そのため、実際の 3D オブジェクトでこれを行う方法を理解する必要があります。


編集:これ、各軸だけで機能します。親が X でのみ回転する場合、子の X 回転でそれを反転させることができます。Z だけでも同じですが、変化を開始してから X と Z の両方を反転すると、すべてがぎこちなくなります。

4

1 に答える 1