THREE.JS - 调整窗口大小时如何保持场景的完整性？

【问题标题】：THREE.JS - How to preserve integrity of the scene when the window is resized?THREE.JS - 调整窗口大小时如何保持场景的完整性？
【发布时间】：2016-03-02 16:15:30
【问题描述】：

我在 div 中有一个场景，它非常适合；但是当我移动窗口时，场景超出了 div 的范围，几乎占据了整个窗口。这肯定有点疯狂。

即使窗口被移动或调整大小，有哪些方法可以将场景保持在 div 内？

【问题讨论】：

标签： javascript html css three.js

【解决方案1】：

创建一个窗口调整大小监听器并附加您的自定义逻辑以保持一致是一种常见的解决方案。

添加监听器：

window.addEventListener( 'resize', onWindowResize, false );

您可以在 onWindowResize 回调方法中添加任何代码，但这里是一个示例：

function onWindowResize() {

    var width = window.innerWidth,
        height = window.innerHeight;

    camera.aspect = width / height;
    camera.updateProjectionMatrix();
    renderer.setSize( width, height );   
}

【讨论】：