False raycaster rotation

Questions
,
1

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
this.obj.rotateY(wall.controller.rotation)

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?

2

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

3

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

Capture
Capture.PNG671×662 34.8 KB

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

Capture
Capture.PNG674×669 40 KB

4

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

5

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?

6

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)
7

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