Search code examples
three.js3dlinear-algebraeigenvector

ThreeJS - Transform by applyMatrix4 doesn't preserve eigen vector's direction

I transformed a vector which lays on the transformation matrix's eigen space using Object3D.applyMatrix4. I expected it not to move because the eigen value was 1, or at least stay on the eigen span, but it moved to an unexpected place.

I've made an sample project: stackblitz

But below is probably all the code you would need to examine

let pointGeo = new THREE.Geometry()
pointGeo.vertices = [new THREE.Vector3(1,-1,1)]
let pmat = new THREE.PointsMaterial({color: 0x00f0f0, size: 0.3})
let pointObj = new THREE.Points(pointGeo, pmat)
let matrix = new THREE.Matrix4()
matrix.set( 1,  3,  3, 0,
           -3, -5, -3, 0,
            3,  3,  1, 0,
            0,  0,  0, 1)
pointObj.applyMatrix4(matrix)

enter image description here

Specifically I'm transforming a point (1, -1, 1) (where the purple square is) with a matrix. Multiplication by the matrix shouldn't change the value. (double checked by hand calculating) But it moves it to where the blue square is.

Is there other stages where some other transformation is applied? What am I missing here?

Solution

  • I've found that Object3D.applyMatrix4 wasn't the right function for explicitly defining local matrix. I tried setting Object3D.matrix property directly and it worked. I changed code like this:

    o.matrix = mat
o.matrixAutoUpdate = false
o.updateMatrixWorld(true)