小编Bjo*_*nir的帖子

我正在使用具有OrbitControls的基本3D场景上的ThreeJS.一切都很好,除了它导致我的整个网站滞后,因为即使用户没有看它,它也会自行循环.我想要一个函数,我可以调用它来满足某些条件时启动和停止渲染(在这种情况下,用户没有查看画布).我有一个很好的启动功能,但停止功能似乎没有工作,因为我的网站在ThreeJS初始化后变得无法忍受地缓慢.

我已经查找并寻找这个问题的解决方案,并找到了几个"解决方案",但无论出于何种原因,它们都无法使用我的应用程序.我的假设是这些解决方案来自旧版本的ThreeJS.

这是我的main.js文件中的代码:

var scene, 
    camera, 
    controls,
    render,
    requestId = undefined;


function init() {
    scene = new THREE.Scene();
    var threeJSCanvas = document.getElementById("threeJS");
    camera = new THREE.PerspectiveCamera( 75, threeJSCanvas.width / threeJSCanvas.height, 0.1, 1000 );

    controls = new THREE.OrbitControls( camera );

    // Controls and Camera settings

    // Create Geometry.

}

function render() {
    requestId =  requestAnimationFrame(render);
    renderer.render(scene, camera);

}

function start() {
    render();
}

function stop() {
   window.cancelAnimationFrame(requestId);
   requestId = undefined;


}

在我的其他javascript文件中,我的pageChange函数中有一个条件(这是一个多页面应用程序),如下所示:

if (page == 5) { // The page with …