Creating a mouse only camera

Questions
1

Greetings…

I am an experienced programmer but new to Babylonjs, and I am having a hard time finding the proper (best) solution for a FPS type movement.

Basically it is simple. I have a ground and want to drive the camera freely around the ground using the mouse only. No keyboard keys and no mouse buttons.

Basic movement:

  • Mouse left rotates the camera left
  • Mouse right rotates the camera right
  • Mouse forward moves the camera forward (in the direction of the cameras rotation)
  • Mouse backward moves the camera backwards

The camera will need to be able to detect collisions with meshes.

I’ve tried universalcamera, freecamera, followcamera, and arcrotatecamera - but I can’t get the controls to act like I need.

I suspect I would be best off with FreeCamera, or FollowCamera with a simple invisible mesh.

Any and all help very much appreciated!

2

Hi.

It would be helpful to create a playground and create a basic imitation of the situation you are in. So we can jump in and figure out together what is going on.

Please check this out,. if didn’t already. You have some built-in tools to work with camera inputs, but for your situation I think that you need custom implementation of mouse inputs. Basically you need to copy behavior of the arrow keys to the mouse inputs.

I think universal camera is good option as it extends TouchCamera, which behaves in the way I think works for you (in the case you need mobile).

So, UniversalCamera, clear inputs, add custom inputs.

For collision detection

I am busy currently, but I will try to create a playground later if I catch some time.

3

Hi… so your suggestion of using UniversalCamera helped me narrow my focus and I reread (yet again) the custom input section.

I was able to use the custom input manager example (which uses keys) and make it work with the mouse. I can now drive and rotate the camera.

However, while it is driving forward, and rotating, it is not driving in the direction of rotation… so I’m guessing I need to look into camera transforms,

Currently I’m just setting the camera position.z for the forward/backward and cameraRotation.y for the left/right rotation. But what I really need is for the new forward direction to move in the direction of the new rotation angle.

Thanks again for your assistance as this pointed me to the proper camera to use.

4

Maybe you can check this out.

Babylon.js Playground (this is playground from thread above)…

5

Thank you once again. That link along with a few others I googled lead me to the cameraDirection.add which did what I wanted to.

Many thanks!

1 Like