How to move an entity based on head rotation in PlayCanvas?

Universal AR PlayCanvas
#1

Reference: https://playcanvas.com/project/784792/overview/face-tracking--cannon-game
I would like to move the 3D model/ entity left & right based on head rotation on y-axis and the entity movement is its animation(strafe left or strafe right) i.e to further explain play the strafe left animation when the user moves his head to the left and vice versa.
Any help or insights regarding achieving such effect is highly appreciated.

#2

Heya,

You could use the rotation Y as the direction value. For example:

Rotation.prototype.update = function(dt) {
    const headRotationY = this.entity.getRotation().getEulerAngles().y;
    const direction = headRotationY * dt;
    console.log(direction);
};

Using dt here to ensure that the speed stays consistent regardless of the frame rate.

Alternatively, to move left/right at a speed independent of rotation you could do something like this:

Rotation.prototype.update = function(dt) {
    const headRotationY = this.entity.getRotation().getEulerAngles().y;

    let direction = 0;

    if(Math.abs(headRotationY) > 5){
        direction =  10 * Math.sign(headRotationY) * dt;
        // 10 is just a speed value, increase to make it faster.
    }
    console.log(direction);
};

or just left/right branching:

// update code called every frame
Rotation.prototype.update = function(dt) {
    const headRotationY = this.entity.getRotation().getEulerAngles().y;

    const threshold = 5;

    if(headRotationY > threshold){
        console.log("left");
    } else if (headRotationY < -threshold){
        console.log("right");
    }
};

This script would be attached to the ‘Face Tracker’ entity.

2 Likes
#3

Awesome Deim, I would certainly try that and post my results soon :v:

#4

hi deim, I tried that but I could not get the entity moving as smoothly as I wanted, I am using setLocalPosition to move the entity to the right position as it does not have a rigid body component to it and suggestions regarding it?

#5

Hi,

Would it be possible to share a minimal project showing this?

Thanks!

#6

I can forward the link on personal message, am not allowed to post it publically.

#7

Sounds good to me! :slight_smile: