Switching perspectives/controls


I am making a simulator to showcase the controls of a drone car I designed.

For the simulator, there are two perspectives: First Person Movement; for walking around outside of the drone car, and Third Person Drone Car Movement; for the perspective of flying it around third person.

The coding question I have is: how do I switch from one camera view and set of controls to another using an arbitrary keyboard press, like “x”?

I want to be able to switch from First Person Movement with the WASD and mouse controls I have now to Third Person Drone Car Movement with WASD/IJKL controls using a button like “x” on the keyboard. (The WASD would be for forward/left/back/right, and IJKL would be for up/yaw-left/down/yaw-right , respectively.)

I got the First Person Movement from PlayCanvas:

And, now I need a reference or help with the Third Person Drone Car Movement as described above, with the additional feature of being able to switch from First Person Movement to Third Person Drone Car Movement using “x” key.

I know there have to be two cameras set up, but that’s about it. I disabled the third-person drone car camera, because it overrides the first-person camera on Launch. In terms of the “added components” like Rigidbody, Collision; all that stuff: I’m not completely sure either; I’m relatively new to scripting and development.

I know there are a lot of ways to do things, and I am going for somewhat “professional”, but the bare minimum will do as well. I don’t mean to make it sound like I’m making you do all the work, but my main skills are in “designing” hence, the descriptive forum post of what I need :p, but I am trying to learn, and the way I learn best is by collaboration, discussion, and dialogue, so if we can: let’s please use this thread to develop this feature together for future reference for other novice developers such as myself!

Thanks so much!

Hi @Lureking and welcome,

One way to do this is to add a script to your root entity (or any other entity at a higher hierarchy level than the two controllers) and toggle on/off the selected controller based on a keypress:

// example code
MyScript.prototype.initialize = function(){
   this.controllerA = this.app.root.findByName('Player');
   this.controllerB = this.app.root.findByName('Lorenz');

MyScript.prototype.update = function(){
   if( this.app.keyboard.wasReleased(pc.KEY_X) ){

MyScript.prototype.toggleController = function(){
   if( this.controllerA.enabled){
      this.controllerA.enabled = false;
      this.controllerB.enabled = true;
      this.controllerA.enabled = true;
      this.controllerB.enabled = false;

Important note: make sure that your controller scripts disable any input handler (e.g. mouse listeners) when they get disabled.


Thanks so much for replying!

I set up the directories like so:
The CameraManager.js is the code you wrote; copy and pasted.

I’m not sure if it’s because I don’t yet have the drone car controls, or if it’s something I don’t have set up correctly in PlayCanvas, but when I launch the sim: “x” doesn’t switch cameras.

I’m very new to coding :sob: so, I have a question: when you need to code something, what’s the first thing you do in terms of research? Do you look at the API, Google for an answer, YouTube videos? I’m trying to be more self reliant, so if you can include some tips I’d appreciate it.

Hi @Lureking! It looks like your script is not attached to an entity. Try to add the script to the script component of an entity to see if it works.

Thanks! That definitely did help. Except, now, when I’m in the third person view, the drone car disappears:

Also, when I press “x” again: the camera stops moving, but it stays in third person.

I just looked at your project and I think the problem is that your project setup doesn’t match your script. In your script you switch between parent entities of the camera’s and not the camera’s itself. Right now one of the camera’s is disabled in your project and you never enable this by script.

I suggest to disable the “Player” entity and enable the “ThirdPersonDrone” camera to see if this gives the right result. (Don’t forget to enable the script component of the “Environment” entity, because I think you have temporarily disabled this right now).

I forked your project and changed the setup.


1 Like