How to change direction of movement of 3rd person

Help & Support
#1

I combined the orbit camera code with 3rd person controller code to control camera rotation with the keyboard instead of the mouse.

https://playcanvas.com/editor/code/867780?tabs=64775158

It works except that the player’s direction does not change with the camera’s direction.

I have a feeling it’s something simple. Thank you ahead for your help.

#2

Hi @metame,

I think you need to change then what forward vector is being used in the PlayerMovement.js script.

I haven’t tried it but try replacing the forward/right variables with this:

    var forward = this.orbitCamera.entity.forward;
    var right = this.orbitCamera.entity.right;

That will make the player move towards the direction of the camera.

Of course then you will have to work a bit harder to rotate the player model to face that direction as well. But it’s a good start.

#3

I believe how third person example does something similar to this too: Third Person Controller | Learn PlayCanvas

1 Like
#4

Yes. the player is moving towards the direction of the camera! But like you said, the player doesnt face that direction so while it looks like it’s running forward, it’s actually moving backward. I am clueless as to how to make the player face that direction.

#5

Yep I got my code from there for third person control. Then I got my orbit code from here. Orbit camera | Learn PlayCanvas and made it work with the keyboard.

Basically, I am trying to replace what the mouse and touch are doing with the keyboard left right up down to change the camera. I am almost there except for this last bug where I am not facing in the direction of the camera.

#6

Looking at the project, you aren’t setting the rotation of the player to face the direction it’s moving to.

Here’s another example where it’s facing the direction it’s moving in: Point and click movement | Learn PlayCanvas

#7

I still dont have a clue as to how to make the player face the direction it’s moving in. Can you give me a code example?

#8

I cannot believe how easy this was.

to use the keyboard instead of the mouse, all I had to do was

CameraMovement.prototype.postUpdate = function (dt) {

 var app = this.app;

 if (app.keyboard.isPressed(pc.KEY_LEFT)) {

        this.eulers.x += 1;

    }

 if (app.keyboard.isPressed(pc.KEY_RIGHT)) {

        this.eulers.x -= 1;

    }

if (app.keyboard.isPressed(pc.KEY_UP)) {

        this.eulers.y += 1;

    }

 if (app.keyboard.isPressed(pc.KEY_DOWN)) {

        this.eulers.y -= 1;

    }

add those lines to cameramovement script in postupdate section. Hope this helps if anyone needs something like this.

2 Likes
#9

what code did you use?