三 js，更新对象的矩阵不会改变它的位置和旋转参数

【问题标题】：THREEjs, updating an object's matrix doesnt change it's position and rotation params三 js，更新对象的矩阵不会改变它的位置和旋转参数
【发布时间】：2020-11-01 14:51:14
【问题描述】：

我想在创建对象时为对象设置一个变换矩阵，然后通过位置、旋转和缩放来控制它，但是虽然更改矩阵确实会更改世界空间中的对象，但它的位置参数仍然保持为 0、0、0。

let mesh =  new THREE.Mesh(
    new THREE.BoxGeometry(),
    new THREE.MeshPhongMaterial({color:0xf15728})
)
this.scene.add(mesh)

let pos = new THREE.Vector3().setFromMatrixPosition(m)

mesh.matrixAutoUpdate = false
mesh.matrix.copy(m)

// ***************//
mesh.updateMatrix()
// ***************//

console.log("mesh.position", mesh.position)
console.log("pos", pos)

这是pos 和mesh.position 的值的输出

【问题讨论】：

标签： matrix three.js transformation

【解决方案1】：

更新对象 matrix 不会更新其位置或旋转字段，默认情况下，three.js 将在渲染前根据 position、rotation 和 scale 值更新矩阵（您已经通过将 matrixAutoUpdate 设置为 false 来禁用）。

如果您想从矩阵初始化对象转换，您可以使用Matrix4.decompose 函数，如下所示：

// m is the initial local matrix transform
m.decompose(
  mesh.position,
  mesh.quaternion,
  mesh.scale,
);

此外，如果您保留 mesh.matrixAutoUpdate = false，则无论何时更改 position、rotation 或 scale 值，您都必须在渲染之前调用 mesh.updateMatrix()。

您可以阅读更多关于矩阵转换如何工作的信息here。

【讨论】：