web-dev-qa-db-ja.com

three.jsは、Object3dをその中心でY軸を中心に回転させます

いくつかのメッシュオブジェクトのグループであるObject3dにThree.JSがあります。
このグループをY軸を中心に回転させたいと思います。中心は、世界の中心（0,0,0）から遠く離れています。
私はGroup.rotate.y += degコードを知っていますが、各軸方向について、グループの中心ではなく、常にオブジェクトを（0,0,0）を中心に回転させます。
これを修正するにはどうすればよいですか？

更新：

コメントを読む

3drotationthree.js
8
MeTe-30

Object3DのrotateOnAxis(axis, angle)関数を見てください。次のようになります。

//declared once at the top of your code
var axis = new THREE.Vector3(0.5,0.5,0);//tilted a bit on x and y - feel free to plug your different axis here
//in your update/draw function
rad += radIncrement;
object.rotateOnAxis(axis,rad);

HTH

7
George Profenza

この回答 助けになりましたが、コードは完全に正しくありません。軸は単位ベクトルである必要があり、object.rotateOnAxis()は増分です。

これが実際の例です：

var axis = new THREE.Vector3(4, 0, 7).normalize();
var speed = 0.01;

// set up scene, etc.

function animate () {

    // other code

    if (object) {
        object.rotateOnAxis(axis, speed);
    }
}
2
黄雨伞

軸three.jsで3Dオブジェクトを回転させる方法 を参照してください。

私はこの問題を次のように解決しました：

SCENEではなく単一のオブジェクト（またはグループ）を回転できるようにするThreeJS用の「ObjectControls」モジュールを作成しました。

ライブラリを含める：

使用法：

var Controls = new THREE.ObjectControls（camera、renderer.domElement、yourMesh）;

ここでライブデモを見つけることができます： https://albertopiras.github.io/threeJS-object-controls/

リポジトリは次のとおりです： https://github.com/albertopiras/threeJS-object-controls 。

0
Alberto Piras