Three.js: OrbitControl with zoom damping?

问题

The damping feature has been added in the r.72dev branch of three.js. It works great for smoother rotating.

Does it enable damping (inertia) for the zoom as well?

controls = new THREE.OrbitControls( camera, renderer.domElement );
controls.enableDamping = true;
controls.dampingFactor = 0.25;

回答1:

I added zoom damping to the three.js r73 OrbitControls, see this demo:

Fiddle using three.js r107, but OrbitControls are still the r73 version: http://jsfiddle.net/y62d4qnr/

Usage is just like the default Orbit Controls, you can play with these settings to customize it:

controls.constraint.smoothZoom = true;
controls.constraint.zoomDampingFactor = 0.2;
controls.constraint.smoothZoomSpeed = 5.0;

Drawback: works only for the mousewheel, not touch zoom or middle mouse. I guess it could be extended, but until now I did not care enough. Im open for suggestions.

My solution is based on this gist from paulkaplan dated 2013: https://gist.github.com/paulkaplan/5770247. Needless to say three.js and Orbit Controls changed a lot since then. I would be grateful if some former author would add this feature officially, but sometimes it takes quite a while ;-)

To give you a quick overview I modified the following:

In OrbitContraint():

Bunch of variables needed for zooming,

added function: this.smoothZoomUpdate = function () { /* ... */ };

and a call to it inside the OrbitConstraint.update() function:

this.update = function () {
    //...
    this.smoothZoomUpdate ();
    //...
}

Also inside the THREE.OrbitControls() modified the function onMouseWheel() { /* ... */ }

来源：https://stackoverflow.com/questions/33468073/three-js-orbitcontrol-with-zoom-damping

标签

javascript

three.js