Three.js对象返回位置/旋转/比例的{www}

时间:2017-11-30 13:16:36

标签: javascript angularjs three.js

我的场景中有一个three.js对象,您可以使用THREE.TransformControls旋转/缩放/移动。在场景中定位对象后,应保存旋转/位置/比例的模具值。我得到的值是这样的:

    // Position
    $scope.scene.updateMatrixWorld(true);
    var position = new THREE.Vector3();
    position.getPositionFromMatrix( $scope.object.matrixWorld );

    // Rotation
    var rotation = new THREE.Euler();
    $scope.object.getWorldRotation(rotation);

    // Size
    var size = new THREE.Box3().setFromObject($scope.object);
    var x = (size.max.x - size.min.x);
    var y = (size.max.y - size.min.y);
    var z = (size.max.z - size.min.z);

因此,当我保存值并使用新值重新加载场景时,该对象看起来确实与应有的不同。所以,我认为,这些函数为旋转/比例/位置提供了错误的值。例如,size.z变量应始终为0,但在保存(并在控制台中打印值)时,它会获得另一个值。

有谁知道为什么?

感谢您的帮助。

1 个答案:

答案 0 :(得分:2)

Three.js提供矩阵分解函数:https://threejs.org/docs/#api/math/Matrix4.decompose

以下是如何使用它的示例:

var translation = new THREE.Vector3();
var rotationQ = new THREE.Quaternion();
var scale = new THREE.Vector3();

myObject.matrixWorld.decompose(translation, rotationQ, scale);

然后,如果您想将旋转保存为Euler:

var rotationE = new THREE.Euler().setFromQuaternion(rotationQ.normalize());

three.js r88