1
votes

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

1

1 Answers

0
votes

I realised that I can rotate objects into pointerlock direction in this way:

var dir = controls.getDirection(new THREE.Vector3());
var dis = 100;
mesh.lookAt({x:d.x * dis, y:d.y * dis, z:d.z * dis});

so I can make enemies send their direction instead of rotation, then make them look at a small distance in that direction.