Need to toggle between First person and top down view

Help & Support
1

I’m building a architecture visualisation application and I want to give the user the ability to navigate in first person camera when needed but toggle to top down floor plan view. But when clicked on a point in the floor plan toggle back to first person view. The closest I have to implementing this is this First Person Movement | Learn PlayCanvas

Can this be done? Any examples out there that might help guide me ?

2

This can be done. Do you need collision or just the WASD and mouse controls like a flying camera?

1 Like
3

Collision would be great, but I heard it’s hard to do between custom 3D model and a first person camera, so I’m setting to just WASD and mouse control on flying camera.

4

If you did need to have collision, then you would need to create your own ‘navmesh’ functionality as it doesn’t come native with PlayCanvas.

There are no examples to do exactly what you need.

There is a fly camera style script in the GitHub repo: https://github.com/playcanvas/engine/blob/master/extras/camera/fly-camera.js

Which part of this application are you having trouble trying to solve? E.g the transition? Being able to switch functionality? etc

1 Like
5

look at this https://playcanvas.com/editor/code/352037/camera.js line 47 and follows

1 Like
6

Thanks @yaustar, @ayrin will check it out.

I was primarily hoping to get an example of switching camera views based on user input.

So I think a script triggering camera view switch ? So yes the transition. I think i can use something like this for it (https://developer.playcanvas.com/en/tutorials/ui-elements-buttons/) with a menu option.
But once i get that transition working, I’d like the camera transition at a point in the model where the user clicks. I’m not quite sure how to achieve that, but should be possible with scripting ?

7

Switching cameras is pretty straight forward. You just disable one and enable the other. eg https://developer.playcanvas.com/en/tutorials/more-cameras/

If you need a transition (eg the camera moving from top down view to ‘first person’ where the user clicks), doing a tween or lerp between the two points and allowing the user to control the camera after the transition has finished we need bespoke code and you won’t find an example that’s exactly right for you.

Yes.

8

Thanks, I think I have enough resources now to get started on this.

1 Like
9

if not you can also attach the camera to the player and do this

if (example) {
this.entity.camera.priority = 100;
}

if (example2) {
this.entity.camera.priority = 1;
}

just make sure the fps camera has a priority of something like 50.

1 Like
10

Priorities are good just make sure if a camera isn’t required to disable it. Otherwise you may get a performance hit from double rendering.

2 Likes
11

actually on the topic of performance can you take look at my project and see what i can do to make it run better?

https://playcanvas.com/editor/scene/1061403

12

From a quick look a good place to start is your draw calls amount, they are too many!

image

Do a good read on the following manual section on how to optimize that and there is also good advice on other things there:

https://developer.playcanvas.com/en/user-manual/optimization/