Zoom to object in ThreeJS

Question

Where can I change the zoom direction in three.js? I would like to zoom in the direction of the mouse cursor but I don\'t get where you can change the zoom target.

Answer 1

If you are using trackball controls,set

trackBallControls.noZoom=true;

and in mousewheel event use this code,

mousewheel = function (event) {

            event.preventDefault();
            var factor = 15;
            var mX = (event.clientX / jQuery(container).width()) * 2 - 1;
            var mY = -(event.clientY / jQuery(container).height()) * 2 + 1;
            var vector = new THREE.Vector3(mX, mY, 0.1);

            vector.unproject(Camera);
            vector.sub(Camera.position);
            if (event.deltaY < 0) {
                Camera.position.addVectors(Camera.position, vector.setLength(factor));
                trackBallControls.target.addVectors(trackBallControls.target, vector.setLength(factor));
                Camera.updateProjectionMatrix();
            } else {
                Camera.position.subVectors(Camera.position, vector.setLength(factor));
                trackBallControls.target.subVectors(trackBallControls.target, vector.setLength(factor));

            }

        };