How to change camera to pan instead of rotate?

Questions
1

I’m using the ArcRotateCamera, which has reliable pinch-to zoom, as well as rotation & panning. However I don’t want to rotate on a single-press, I want to pan, and I want the panning to happen on the X & Y axis, not the Z axis.

I need to have my camera pan on the X & Y axis instead of rotating around the target when the mouse button is held or a single finger is used to pan on screen. I don’t actually need rotation, but having two-finger touch rotation would be great for dev-time. I want to keep the zoom behavior.

I can’t seem to figure this out from the docs, with the only lead being hammerjs, however the example project largely is broken as far as pinch-to-zoom goes. It seems to be reinventing touch-controls, and they are not great. I also can’t make heads or tails of why some of the example code is the way it is in order to attempt to start debugging.

How can I achieve this without attempting to reinvent touch controls?

Bonus: Can the camera activity be observable? For instance to ignore/disable mesh picking while the camera is zooming or panning.

2 
camera.onViewMatrixChangedObservable.add(function(){
    console.log("onViewMatrixChangedObservable")
})

Here is a draft PG with panning - https://www.babylonjs-playground.com/#VE33T#27

1 Like
3

Hi!
I’ve updated the hammerjs demo. A lot of has changed:
https://demos.babylonjs.xyz/hammerjs-example/#/

Would you try it out?

Please keep in mind that double touches close enough on the Y axis are handled as tilt and you have to release the touch to exit the tilt mode.

Thanks!

EDIT: It’s calibrated to a FULL HD screen, so 72dpi. On mobile the movement will be much slower as expected.

2 Likes
4

Tested with Chrome and Safari at iPad Pro, touch events work with no problems.

1 Like
5

Thank you @labris! It’s good to have tested by someone else on other devices as well! I am going to put it in the repo.

1 Like
6

Oh this is much better! Pinch to zoom is still kind of hit or miss though, and it’s very hit or miss if using thumbs, I think it’s hitting tilt when pinching is occurring?

If tilt is disabled would pinch zooming be more reliable? In my case I don’t care much about tilt, or rotation. If I’m changing the tilt it would be zoom-level based (No free zoom, only zooming to & from preset levels).

Do you know if there is a way to “normalize” the DPI in such a way that there is little to no difference in panning speed on different devices?

@labris Thanks for the PG! It looks like the camera is panning on the Z axis as well though, instead of only panning on the XY plane?

I’ll be circling back around the touch controls after some other work, which i when I’ll give this another good try.

2 Likes
7

Yep, this was designed to be used on big touch screens. But I have an idea how to make the pinch/zoom better. I will simply not test whether in case of first double touch the distance X and Y between the touches is within the configurable pixels treshold, but I’ll check the angle between the two touches. This will be more reliable on small screens. I’m going to try it now. :vulcan_salute:

This have to be fairly easy just by multiplying every movement by a DPI ratio. However I never thought of it any deeper. Not yet.

EDIT: Repo updated. Demo updated. One thing that is still missing is the distance based movement/zoom ratio.

3 Likes