使用 .Euler 的“setFromVector3”将欧拉角转换为矢量答案

【问题标题】：Convert Euler angle to Vector using .Euler's "setFromVector3"使用 .Euler 的“setFromVector3”将欧拉角转换为矢量
【发布时间】：2020-12-21 18:02:05
【问题描述】：

所以输入是三个欧拉角 x,y,z 以弧度表示我想将其转换为以中心为原点的向量位置 X,Y,Z。

所以如果可以使用https://threejs.org/docs/#api/en/math/Euler.toVector3 来获取向量，我想知道如何。并且还赞赏替代数学（正弦/余弦）解决方案。

所以在这个 sn-p axesHelper 表示角度，立方体应该在基于欧拉的位置。使用 Dat gui 实时编辑旋转。

//add Axis to represent Euler
const axesHelper = new THREE.AxesHelper( 5 );
scene.add( axesHelper );

//add cube to represent Vector
const geometry = new THREE.BoxGeometry( 0.1, 0.1, 0.1 );
const material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
const cube = new THREE.Mesh( geometry, material );

scene.add( cube );

render()

const gui = new GUI();
const angles={
    degX:0,
    degY:0,
    degZ:0,
}


gui.add( angles, 'degX',0,360,1 ).onChange(function(){
    axesHelper.rotation.x=THREE.MathUtils.degToRad(angles.degX)
    render()
    updateEULtoAngle()

});
gui.add( angles, 'degY',0,360,1 ).onChange(function(){
    axesHelper.rotation.y=THREE.MathUtils.degToRad(angles.degY)
    render()
    updateEULtoAngle()

});
gui.add( angles, 'degZ',0,360,1 ).onChange(function(){
    axesHelper.rotation.z=THREE.MathUtils.degToRad(angles.degZ)
    render()
    updateEULtoAngle()
});

console.log(THREE.MathUtils.radToDeg( axesHelper.rotation.x))
console.log(THREE.MathUtils.radToDeg( axesHelper.rotation.y))
console.log(THREE.MathUtils.radToDeg( axesHelper.rotation.z))



function updateEULtoAngle(){
    let eul= new THREE.Euler(
        THREE.MathUtils.degToRad(angles.degX),
        THREE.MathUtils.degToRad(angles.degY),
        THREE.MathUtils.degToRad(angles.degZ)
        )
    let vec= new THREE.Vector3()
    eul.toVector3(vec)
    console.log(eul,vec)
    cube.position.copy(vec)
}

虚假的视觉表现 cube following the axes Y axis

相关：但轴匹配有问题How to convert Euler angles to directional vector?

【问题讨论】：

标签： javascript vector three.js euler-angles

【解决方案1】：

Euler.toVector3() 不符合您的要求。它只是将 x、y 和 z 角复制到各自的向量分量中。

我认为您应该看看THREE.Spherical，它是使用球坐标的实现。您可以用两个角度（phi 和 theta）和一个半径来表示 3D 空间中的一个点。然后可以使用这些数据通过Vector3.setFromSpherical() 或Vector3.setFromSphericalCoords() 设置Vector3 的实例。

【讨论】：

` vec.setFromSphericalCoords(1, radX,radZ,)` 非常接近......它现在可以正确跟踪 Y 轴，但旋转 Z 的影响绝对为零。