Converting Rotation radians to Euler

Questions
, ,
1

I am developing a small multiplayer game with an authorative server where the server simulates the gameworld collider in 2d. On the server i apply rotation to certain points based on a radians value to rotate the object around itself. This radians value is basically always increasing when you rotate Right, and decreasing to rotate left. Since i calculate the rotation with sin/cos the radians value does not need to be normalized.

Now i want to update my local threejs object with the same rotation and am a bit stumped on how to do it.
In threejs, i want to rotate my object around the Y Axis. Here the rotation is normalized to go from -Pi/2 - Pi/2 and when one of the max points is reached the value goes in the opposite direction in which case it also seems like the X,Z rotation basically flips from 0 to +PI or -PI depending on the direction of the rotation. I don’t really understand whats going on, any tips on how to convert/normalize my radians value to the threejs rotations ? What do i need to read up on ? Or find a different approach ?

Best!

2

Hi!

Could you explain, what is “normalized radians”?

3

I think it’s better to avoid euler angles and work directly with quaternions. You could try to convert your rotation data to quaternions on the server and then read this data from your three.js app.

4

by normalized i mean that its not in the range of -2Pi <= 2Pi but basically goes to ±Infinity which is not an issue for how i do rotations other than that the value could get quite big when a player rotates a lot in one direction :wink: I can still normalise it on the server to avoid having big values, however i still don’t know how i would convert it to a threejs rotation on the client side.

5

Thanks for your feedback guys.

Even though in my game i am just rotating around one axis (Y) ? Its a pseudo 3D game => http://panzerkampf.io

On the Server i basically just have 2D colliders as rects and just rotate the points in 2d space around the pivot. The client just sends input data of keys pressed and the server does the simulation, for rotations i am basically just increasing/decreasing the radians value of a specific rectangle collider and send that back to the client.
That works quite good in my 2D multiplayer playground (see http://panzerkampf.io/collision_playground.html ) but its a bit hard for me to translate it to the threejs rotations.

I don’t know anything about Quaternions yet, i guess that would involve some studying but i am happy to tackle that. Any specific topics i should check on ?

6

i would kind of prefer doing it on the client side to avoid the serverside computation, would something like this work ?

var quaternion = new THREE.Quaternion();
quaternion.setFromAxisAngle( new THREE.Vector3( 0, 1, 0 ), Math.PI / 2 );
var vector = new THREE.Vector3( 1, 0, 0 );
vector.applyQuaternion( quaternion );

where Math.PI / 2 would be my radians value from the server, but i guess i still have to normalise it.