False raycaster rotation

Hey Im having a object3D with 4 raycasters in each direction. The object is draggable and when the raycaster hits, it applies the rotation of the hit object to itself.

this.obj.rotation.set(0, 0, 0)
console.log(wall.controller.rotation) // logs: 3.141592653589793

When updating the raycasters origin and direction, which always applies the rotation of the object3D to itself, I get a false rotation.

this.direction.set(0, 0, 1)
console.log(this.obj.rotation.y) // logs: 1.2246467991473532e-16
this.direction = this.direction.applyAxisAngle(this.axesRotation, this.obj.rotation.y)
this.frontRaycaster.set(this.center, this.direction)

So 1.2246467991473532e-16 should be Math.PI. Is there a work around?

What is the reason for setting the value to (0,0,-1) ?

Reason for that was a false init rotation, but I already corrected it. Front is now (0, 0, 1). Still getting the same values.

Dragging it down against the bottom wall rotates the obj, but the raycasters wont rotate. All other directions work fine.

Why am I getting this false value?! 1.2246467991473532e-16 should be Math.PI .

Sry, it’s not possible to help you with what you’ve provided so far. Can you pelase demonstrate the issue in a small, isolated live example?

Here is a fiddle which just rotates a object3D container and alerts its Y rotation after updating matrix world. The rotation value (-3.141592653589793) is an angle calculated from 3 2d points like so:

let r = Math.atan2(p3.z - p1.z, p3.x - p1.x) - Math.atan2(p2.z - p1.z, p2.x - p1.x)

The problem is that multiple euler angles can represent the same rotation. So just evaluating the y angle does not work. If you inspect the other two angles (x and z), you will see a difference compared to the initial values.

I suggest you avoid to work with euler angles and focus on quaternions instead. Transform your direction vector like so:

this.direction.applyQuaternion( this.obj.quaternion );
1 Like