# Rotate Entity To Face Camera

Hi, I’m having great difficulty using the tween library to get an object to tween to face the camera… This is what I have but depending on where my camera is, the final rotation is always different.

``````t = new pc.Vec3(this.myCamera.getLocalEulerAngles().x,this.myCamera.getLocalEulerAngles().y,this.myCamera.getLocalEulerAngles().z)
this.myTween= myEntity.tween(myEntity.getLocalEulerAngles()).rotate(t, 0.4, pc.SineOut).start();
``````

Any ideas? Thanks

Hey,

you need to calculate direction and euler properly to face camera.

``````    var entityPosition = this.entity.getPosition();
var cameraPosition = this.camera.getPosition();
var direction = cameraPosition.clone().sub(entityPosition);

// Calculate the Euler angles to face the camera
var rotationEuler = new pc.Vec3();
rotationEuler.set(0, Math.atan2(direction.x, direction.z) * pc.math.RAD_TO_DEG, 0);
entity.tween(entity. getLocalEulerAngles()).rotate(eulerAngles, 0.4, pc.SineOut).start()
``````

Thanks. Unfortunately using this I still get the object tween to different rotation angles depending on the camera facing.
My full code:

`````` this.entity_to_rot = hitEntity.parent;
var entityPosition = this.entity_to_rot.getPosition();
var cameraPosition = this.myCamera.getPosition();
var direction = cameraPosition.clone().sub(entityPosition);

// Calculate the Euler angles to face the camera
var rotationEuler = new pc.Vec3();
rotationEuler.set(0, Math.atan2(direction.x, direction.z) * pc.math.RAD_TO_DEG, 0);
this.entity_to_rot.tween(this.entity_to_rot.getLocalEulerAngles()).rotate(rotationEuler, 0.4, pc.SineOut).start();
``````

Something to do with local/global? I’ve tried seemingly hundreds of permutations but the rotation is always different.

It seems that the rotations are different because the entities I am rotating belong to parents and grand parent with different rotations and for some reason those rotations are also coming into the equation… How can I prevent that?

EDIT: Actually, I am already unparenting the objects from anything before the rotation so they are always direct children of root…but still I get the different rotations.

try:

``````  var globalPos1 = this.entity.getWorldTransfrom()
var entityPosition = globalPos1.getTranslation(this.entity.getLocalPosition());
var cameraPosition = this.myCamera.getPosition();

// Calculate the Euler angles to face the camera
var rotationEuler = new pc.Vec3();
rotationEuler.set(0, Math.atan2(direction.x, direction.z) * pc.math.RAD_TO_DEG, 0);
this.entity_to_rot.tween(this.entity_to_rot.getLocalEulerAngles()).rotate(rotationEuler, 0.4, pc.SineOut).start();
``````

This almost works.(I think there were parts missing in your example so hopefully I filled in the blanks correctly) The object always faces the camera but I think depending on the cameras position the object can be upside down or rotated clockwise or anti clockwise…?!?

``````var globalPos1 = this.entity_to_rot.getWorldTransform()
var entityPosition = globalPos1.getTranslation(this.entity_to_rot.getLocalPosition());
var globalCamPos = this.examine_camera.getWorldTransform()
var cameraPosition = globalCamPos.getTranslation(this.examine_camera.getLocalPosition());
var direction = cameraPosition.clone().sub(entityPosition);

// Calculate the Euler angles to face the camera
var rotationEuler = new pc.Vec3();
rotationEuler.set(0, Math.atan2(direction.x, direction.z) * pc.math.RAD_TO_DEG, 0);

this.entity_to_rot.tween(this.entity_to_rot.getLocalEulerAngles()).rotate(rotationEuler, 0.4, pc.SineOut).start();
``````

try to use `lerp` function instead of tween