Custom ArcRotateCamera touch controls

Hey there!

My custom touch controls for the arc camera are getting better so I would like to share my progress with you. It’s kinda cool of controlling the scene this way. :joystick: It’s a Google Earth touch control clone - the ugly one :smiley:

The solution is based on HammerJS. I am working on removing the depedency. The only thing it still uses from HammerJS is the event system. I am also planning to add some inertia to get a smoother feedback.

The debug gizmos can be turned on and off by calling setDebugMode(state) on the input class.

The input can be added to the scene like this:

    // remove mouse pointer input
    camera.inputs.removeByType('ArcRotateCameraPointersInput')
    // add hammer js input
    const hammerJsInput = new ArcRotateCameraHammerJsInput()
    camera.inputs.add(hammerJsInput)
    hammerJsInput.setDebugMode(true)

    camera.attachControl(canvas, true)

I hope someone will find this useful!
R. :vulcan_salute:

DEMO:
https://demos.babylonjs.xyz/hammerjs-example/#/

REPO:

8 Likes

Excellent!

1 Like

@roland you nailed it… again :wink:

1 Like

Thank you @sebavan! You guys make me happy and smiling all the time!

1 Like

Awesome!

1 Like

Just a quick note. The demo is updated, smooth movement achieved, feels much less nervous :smiley: still beta though… Have a nice weekend everyone!

1 Like

Nice!

2 Likes