I am creating a little multiplayer game basing on this three.js pointerlock example
I need to rotate the enemies avatars on the actual player screen, so he can see the direction they are looking at, but I cannot figure out how to properly do it
At the moment each enemy is sending an object with his position and rotation to the server
{
position: controls.getObject().position,
rotation: controls.getDirection(new THREE.Vector3())
}
the server receives it and sends to the actual player who with a function selects the respective enemy mesh (avatar) in the map and applies the position/rotation to it
var object = scene.getObjectByName(data.player);
object.position.x = data.position.x;
object.position.y = data.position.y;
object.position.z = data.position.z;
object.rotation.x = data.rotation.y;
object.rotation.y = data.rotation.x;
object.rotation.z = data.rotation.z;
But only the position works, the rotation is not working properly: the resulting rotation axes seem to be inverted and they also vary depending on the direction the actual player is looking at
Edit:
I tried also to "clone" it into another camera with different rotation.order
as described here
var camera2 = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 1, 1000);
camera2.rotation.order = 'YXZ';
var yawObject = controls.getObject();
var pitchObject = yawObject.children[0];
camera2.rotation.set(pitchObject.rotation.x, yawObject.rotation.y, 0);
and making enemies send
{
position: controls.getObject().position,
rotation: camera2.rotation
}
but rotation is still wrong