Three.js: Orbit Controls pan on two finger unidirectional touch

Created on 27 Jul 2017 · 13Comments · Source: mrdoob/three.js

Currently Orbit Controls handles touch as:

one finger: orbit
two fingers: zoom
three fingers: pan

It's a fantastic helper library, but I think panning is terribly hard to discover. I only discovered it by looking through the library, and don't think I would have discovered it just by playing around with a scene on a touchscreen device.

As a user, I would expect to be able to pan using two fingers moving unidirectionally. I would expect to be able to zoom using two fingers, in a pinching and zoom gesture. I would suggest instead:

one finger: orbit
two fingers (pinch/spread): zoom
two fingers (unidirectional): pan

I haven't implemented this yet, but I'm thinking to in the next couple of weeks. I couldn't find a related issue or discussion of this so I'm opening a ticket and see if anyone has pre-existing ideas or concerns around this? I could contribute a PR in the future if it's a desirable change.

Enhancement

Source

smcllns

👍2

Most helpful comment

I actually have this working and am waiting on #13242 to be merged/rejected.

WestLangley on 5 Feb 2018

👍4 ❤3

All 13 comments

Related: #10597

WestLangley on 28 Jul 2017

@mrdoob I'd like to take this if no one is working on it :)

wuweiweiwu on 5 Feb 2018

I actually have this working and am waiting on #13242 to be merged/rejected.

WestLangley on 5 Feb 2018

👍4 ❤3

Is that feature working yet?

How can I utilize 2 fingers panning?

ranbuch on 10 Feb 2018

Same question from me. Would be very interested in two finger panning.

huj2 on 22 Feb 2018

👍1

@WestLangley the PR #13242 has been merged :)

Do you need help for this one ? I think I'll be able to work on it next week

moroine on 26 Mar 2018

@moroine I'll file what I have this week and you can see if you can improve it. :)

WestLangley on 26 Mar 2018

❤1

@WestLangley I think I've also some stuff. I'm taking back our library based on three.js and there is a lot of stuff done on our side based on copy/past three.js then edit but as you can imagine that's a nightmare to maintain. So I've dediced to do some PR of theses features (it will take some time)

Import ambient occlusion in ColladaLoader
ColladaExporter (the file is not valid but works with Blender and ColladaLoader1)
OrbitControl (THREE.HorizontalPanning 😞 and rotation & zoom using two finger at the same time). You can have a look here

moroine on 27 Mar 2018

If this feature is already merged, Can someone please guide, how we can implement same in our existing three.js application.

BashCloud on 30 Jul 2018

@BashCloud Sorry, this is not a help site. Try the three.js forum, and show what you have tried.

WestLangley on 30 Jul 2018

Fixed in #13706. Closing.

WestLangley on 30 Jul 2018

@mrdoob hello Mr.mrdoor I am very interesting in threejs ,And I have been encounter with a problem, about orbit control 's pan ,I have been controll target and camera for pan ,but it's not very good for pan ,I want to use this value property or method "pan" in orbit control ,I will be very thank you for your help! thank you very much Mr!