Management of the three.js trackball without a roll

Question

Does anyone know if / can change the control of the trackball to maintain the horizon, but still allow you to rotate around and above the object?

By setting axis.x and axis.z to 0, it stops the roll, but also stops the possibility of turning over the object.

The orbit control is close to what I'm looking for, but does not have the ability to pan.

Any help?

Answer 1

Some time has passed since this question was asked, but I ran into the same problem and did not find a lot of discussion on the Internet, so I decided to publish my solution.

If you must use TrackballControls and want a horizontal horizon, you can simply edit the TrackballControls.js library by adding the following line to the end of this.rotateCamera method

this.object.up = new THREE.Vector3 (0,1,0); This fixes the upward direction of the camera in the (0,1,0) direction (i.e., in the y direction). Then the entire modified function of the method will read:

this.rotateCamera = function () { var angle = Math.acos( _rotateStart.dot( _rotateEnd ) / _rotateStart.length() / _rotateEnd.length() ); if ( angle ) { var axis = ( new THREE.Vector3() ).crossVectors( _rotateStart, _rotateEnd ).normalize(); quaternion = new THREE.Quaternion(); angle *= _this.rotateSpeed; quaternion.setFromAxisAngle( axis, -angle ); _eye.applyQuaternion( quaternion ); _this.object.up.applyQuaternion( quaternion ); _rotateEnd.applyQuaternion( quaternion ); if ( _this.staticMoving ) { _rotateStart.copy( _rotateEnd ); } else { quaternion.setFromAxisAngle( axis, angle * ( _this.dynamicDampingFactor - 1.0 ) ); _rotateStart.applyQuaternion( quaternion ); } } // Lock the camera up direction this.object.up = new THREE.Vector3(0,1,0); }; 

Answer 2

It seems to work for me, working on the math behind her. [edit] First I use camera.lookAt(someObj) , then this.

 camera.rotation.z = Math.sin(camera.rotation.y)/3.5 

Answer 3

To use WestLangley's comment by including screenSpacePanning in OrbitControls, you get equivalent functionality for TrackballControls without scrolling.

  let controls = new THREE.OrbitControls(camera); controls.screenSpacePanning = true;