Three.js: Orbitcontrol With Zoom Damping?
Solution 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() { /* ... */ }
Post a Comment for "Three.js: Orbitcontrol With Zoom Damping?"