Need some help understanding how to make Blender Style Camera Input Controls

I’m attempting to make blender style panning, zooming, rotating into blender as a custom keyboard/mouse input. Blender uses middle mouse and drag to rotate, shift + middle mouse and drag to pan, and mouse scroll wheel to zoom.

I’m struggling to get this to work the way I want it to. The panning feature should only pan in the camera’s x and y viewport axes, but instead seems to be rotating the camera. I don’t understand why that is happening. The zoom feature also doesn’t seem to modify camera’s local z, but seems to move us in world z.

Here’s the playground of the work in progress: https://playground.babylonjs.com/#2RQBKN

I couldn’t find much detailed documentation about how camera movement works. This code is pieced together from playground samples I found and just trial and error.

Check this out:

It turns out my main problem was not removing the default attached mouse input cleanly. The reason panning was also rotating was because the default mouse controller was still contributing rotation when I moved the mouse. Here’s an updated playground with issue fixed: https://playground.babylonjs.com/#2RQBKN#1

1 Like

Actually I guess this still isn’t quite right. The rotation I currently have is like a first person shooter, turning head left or right, up and down etc, but in Blender the rotate control acts more like an arc rotate camera. Is there a way to have this camera behave both ways? left click and drag to rotate like first person shooter, and middle mouse click and drag to rotate like arc-rotate camera?

I guess there is a lot of code to look at to figure out what arc rotate camera is doing: https://github.com/BabylonJS/Babylon.js/blob/f39e7a9c5b913982dea11906cdc9aa7a680cf5a9/src/Cameras/arcRotateCamera.t

Is there another way?