三个js旋转一个轴朝向相机,不受父母的影响

问题描述 投票:0回答:1

我有情况:

    var camera = new THREE.PerspectiveCamera(...);
        scene.add(camera);

    var parent = new THREE.Object3D();
        parent.position.set(1,2,3);
        scene.add(parent);

    var child = new THREE.Object3D();
        child.position.set(4,5,6);
        parent.add(child);


   var v = new THREE.Vector3().copy(child.position); 
       child.localToWorld(v);

   child.rotation.z = Math.atan2( ( v.x - camera.position.x   ), ( v.y - camera.position.y ) );

它工作,孩子在Z轴上面对相机。

当我做:

parent.rotation.set(1,2,3); // or whatever

子项受旋转影响,如何避免旋转并保持子项处于旋转父项之前相同的旋转(通过父项转换更新局部旋转视觉上不变),但是由于父项旋转而保持全局位置更改?

three.js
1个回答
0
投票

设置子对象的旋转后,请尝试以下操作:

var matrix = new Matrix4();
var quaternion = new THREE.Quaternion();

parent.updateMatrixWorld(); // ensure matrixWorld is up to date
matrix.extractRotation( parent.matrixWorld );
quaternion.setFromRotationMatrix( matrix );
child.quaternion.premultiply( quaternion.inverse() );
© www.soinside.com 2019 - 2024. All rights reserved.