简体   繁体   English

无法使Three.js TrackballControl缩放正常工作

[英]Can't get Three.js TrackballControl zoom to work

My code 我的密码

//zoom and scaleFactor are both constants
renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
camera = new THREE.OrthographicCamera(
    window.innerWidth / - (zoom / scaleFactor),
    window.innerWidth / (zoom / scaleFactor),
    window.innerHeight / (zoom / scaleFactor),
    window.innerHeight / - (zoom / scaleFactor), 
    -500, 1000
);
scene = new THREE.Scene();
controls = new THREE.TrackballControls(camera, renderer.domElement);

Hello people of stackoverflow, I can't seem to get zoom to work with the trackball control object in Three.js. 大家好,stackoverflow,我似乎无法放大到与Three.js中的轨迹球控制对象一起使用。 I used the OrbitControls object and it worked swimmingly, but zoom simply isn't working when i use TrackballControls. 我使用了OrbitControls对象,并且可以流畅地工作,但是当我使用TrackballControls时,缩放根本不起作用。 I made sure that noZoom is false and played around with zoomSpeed, both to no avail. 我确保noZoom为false并以zoomSpeed播放,但均无济于事。 I also tried debugging the source code for TrackballControls but that didn't get me anywhere. 我还尝试调试TrackballControls的源代码,但这并没有帮助我。

Is it relevant that I'm using an orthographic camera? 我使用的是正交摄影机吗? It seems plausible to me that the zoom actually just moves the camera forward and back to achieve zoom, hence the zoom doesn't work with orthographic projection, but at the same time that would mess with the perspective of the image using a perspective camera. 在我看来,变焦实际上只是将摄像机前后移动来实现变焦,因此,变焦不适用于正交投影,但同时会干扰使用透视摄像机的图像的透视。

I'd appreciate any help. 我将不胜感激。 Thank you! 谢谢!

It appears to me that the method of zooming that TrackallControls uses is actually to move the camera back and forth, hence no zoom is achieved when using an orthographic camera. 在我看来,TrackallControls所使用的缩放方法实际上是前后移动相机,因此在使用正交相机时无法实现缩放。 What I did to get zoom is to add the following lines to my source of TrackballControls.js around line 480: 我要做的缩放操作是将以下行添加到第480行附近的TrackballControls.js源中:

case 2:
    // Zoom in pages
    _zoomStart.y -= event.deltaY * 0.025;
    //add the following 2 lines
    object.zoom -= event.deltaY * 0.025;
    object.updateProjectionMatrix();
    break;

Do the same for the rest of the cases and you now have zoom when you scroll the mouse. 在其余情况下也一样,现在滚动鼠标时便具有缩放功能。 It's not as fluid as the normal zoom though. 但是,它不像普通缩放那样流畅。 Also, the code you add still runs even when you're using a perspective camera, so you'll have to put a check somewhere in there to prevent that if you want your zoom to work normally with a perspective camera. 此外,即使使用透视相机时,添加的代码仍然可以运行,因此您必须在其中进行检查,以防止您希望缩放与透视相机一起正常工作。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM