CODEWITHSUNDEEP
javascriptthree.jsmousemousewheelorbitcontrols
liminalFrog
liminalFrog

Reputation: 15

three.js - OrbitControls damping works when mouse pressed but no damping when mouse stops moving

This may be hard to explain:

Using OrbitControls in three.js and have enabled damping for smooth rotation with the mouse. It works partially. I click, I drag, the damping works fine, but as soon as I stop moving the mouse, with the button still held down, the damping stops and the scene halts instantly instead of smoothly dragging a bit longer.

Interestingly, when I use the scroll wheel, the damping that didn't finish picks up again in an ease-out fashion while rolling the wheel.

My OrbitControls are set up as follows:

const controls = new OrbitControls( camera, renderer.domElement );

controls.target.set(0,0,0);
controls.enableDamping = true;
controls.dampingFactor = 0.07;
controls.enablePan = false;
controls.maxDistance = highestDimension * 2;
controls.minDistance = 10;
controls.minPolarAngle = Math.PI / 8;
controls.maxPolarAngle = Math.PI / 2;
controls.update();

I'm not seeing any other options for damping online, unless I'm missing something.

Upvotes: 0

Views: 154

Answers (1)

Łukasz Daniel Mastalerz
Łukasz Daniel Mastalerz

Reputation: 2217

Try stick controls.update inside animaton loop.

function animate() {
  requestAnimationFrame(animate);
  controls.update();
  renderer.render(scene, camera);
}
animate();

Upvotes: 0

Related Questions