Can I Invert OrbitControls.js drag control?

Questions
1

Hi guys,

I’m trying to create first-person camera move control on my web,
and I want to ask Can I invert OrbitControls.js mouse drag control.
Right now, both the pan and tilt directions are reversed.

I set the basic JS setup for OrbitControls + WASD position control,
please help with that!

2

It is not possible to configure reversed controls. You have to modify the code to implement this use case.

3

It is a small, but imo. great extra feature of the OrbitControls. Why not add it?: Sci fi (threeml.org)

var OrbitControls = function ( object, domElement ) {
…
this.reversed = false;
…

function handleMouseMoveRotate( event ) {
	...
	var inv = scope.reversed ? 1 : -1;
	rotateLeft(inv * 2 * Math.PI * rotateDelta.x / element.clientHeight ); // yes, height

	rotateUp(inv * 2 * Math.PI * rotateDelta.y / element.clientHeight );
1 Like
4

OrbitControls can’t accommodate all possible use cases. We only support the most common ones so the class keeps maintainable.

1 Like
5

we would accept a pr for it: GitHub - pmndrs/three-stdlib: Stand-alone library of threejs examples designed to run without transpilation in node & browser the goal for that project currently is to tag along the original jsm with a bit more modern build and expanded feature set, it’s a community managed fork. it’s not a small project any longer if that’s a worry, the react space especially depends on it.

6

hi guys,
Thank you for many replies, and I solved it, but I am concerned about is this solution good for all devices.

I want to invert mouse drug control of OrbitControls, so I changed controls.rotateSpeed for minus number.

like this:

var controlsrotatespeed = -0.15;
    switch (device) {
        case 'PC':
            controlsrotatespeed = -0.15;
            break;
        case 'TB':
            controlsrotatespeed = -0.4;
            break;
        case 'SP':
            controlsrotatespeed = -0.6;
            break;
    }
    controls.rotateSpeed = controlsrotatespeed;

It looks working, but I can’t judge this solution is good for any device.
Can anybody advise this?

Thank you

7

I made a PR for three-stdlib about this, and was approved.

8

I tried your code controlsrotatespeed but it doesn’t work with OrbitControls.js, is there a way to reverse the OrbitControls.js drag? Because in mobile virtual tour rotations should be reversed, instead of aiming the camera towards space, in mobile you drag the space instead.