Three.js: 立方体をその端の周りで回転させます。

作成日 2012年02月05日  ·  5コメント  ·  ソース: mrdoob/three.js

みなさん、こんにちは!

私はすでに任意の軸の周りの回転について尋ねていました、そして#1219と#1220に投稿された明確な答えを得ました。

しかし、立方体をそのエッジの1つを中心に回転させる方法はまだ不明です(そのようなコードが存在する場合、誰かがそのようなコードを共有できますか)。

#1219には2つの関数が投稿されました。

function rotateAroundObjectAxis( object, axis, radians ) { .. }

そして

function rotateAroundWorldAxis( object, axis, radians ) { .. }

立方体を、その境界ボックスの中心を通る任意の軸を中心に回転させることができます。

私が必要としているのは、必ずしもオブジェクトの中心を通過するとは限らない任意の軸を中心にオブジェクトを回転させることです。

それを正しく行う方法は?

申し訳ありませんが、少し面倒ですが、そのような機能を実装したいと思います。

ありがとう。

PS次のような関数が必要なようです。

関数rotateAroundArbitraryAxis(オブジェクト、axisDirection、axisBasePoint、ラジアン){..}

axisBasePointとは、指定された軸が通過するポイントを意味します。

私はインターネットで、そのようなローテーションはいくつかのステップで行われるべきだと読みました。

  1. 回転軸が原点を通過するように空間を移動します。
  2. 回転軸がXZ平面にあるように、Z軸を中心に空間を回転させます。
  3. 回転軸がZ軸に沿って配置されるように、Y軸を中心にスペースを回転させます。
  4. z軸を中心にシータで目的の回転を実行します。
  5. 手順(3)の逆を適用します。
  6. 手順(2)の逆を適用します。
  7. 手順(1)の逆を適用します。

正しく理解できますか?

three.jsでそのような操作を実行する方法は?

three.jsで異なる(平行移動/回転)行列を互いに乗算しようとしましたが、目的の結果が得られませんでした:-(

どうもありがとう。

Question

最も参考になるコメント

このようなものはどうですか?

var dummy = new THREE.Object3D();
dummy.position.x = 50;
dummy.position.z = 50;
scene.add( dummy );

var cube = new THREE.Mesh( new THREE.CubeGeometry( 100, 100, 100 ), new THREE.MeshBasicMaterial() );
cube.position.x = - 50;
cube.position.z = - 50;
dummy.add( cube );

全てのコメント5件

このようなものはどうですか?

var dummy = new THREE.Object3D();
dummy.position.x = 50;
dummy.position.z = 50;
scene.add( dummy );

var cube = new THREE.Mesh( new THREE.CubeGeometry( 100, 100, 100 ), new THREE.MeshBasicMaterial() );
cube.position.x = - 50;
cube.position.z = - 50;
dummy.add( cube );

返信いただきありがとうございます。

残念ながら、あなたの例の立方体は、私が何と呼んでも、その中心を通るローカル軸を中心に回転します。

function rotateAroundObjectAxis( object, axis, radians ) { .. }

または

function rotateAroundWorldAxis( object, axis, radians ) { .. }

私が本当に理解したいのは、特定のオブジェクトの回転軸をシフトする方法です。

どうもありがとう。

立方体の代わりにダミー/コンテナを回転させてみましたか?

いい視点ね。 このように機能します。

しかし、なぜそれはそれほど単純ではないのですか:-)?

最初の投稿で提案した関数を使用した行列演算か、もっと便利なものにする必要があります。

function rotateAroundArbitraryAxis( object, axisDirection, axisBasePoint, radians ) { .. }

axisBasePointとは、指定された軸が通過するポイントを意味します。

よろしくお願いします。

@oosmoxiecodeおっと! ええ、私のスニペットでそれを忘れました。

@家主まあ、それは私には簡単です。 行列の知識すら必要ありません;)私は違う考え方の問題だと思います...いずれにせよ、内部的には同じ行列計算が行われています。

このページは役に立ちましたか?
0 / 5 - 0 評価