仅在滚动或移动鼠标时渲染答案

【问题标题】：Rendering only working when scrolling or moving mouse仅在滚动或移动鼠标时渲染
【发布时间】：2015-08-27 05:24:09
【问题描述】：

我在让我的动画工作时遇到了一个大问题，除非我用鼠标环顾四周，否则场景中没有任何动画。一旦我停止环顾四周，动画就会停止。尝试了很多东西，但无法弄清楚我做错了什么。

function onMouseMove(e) {
    mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
    mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
}    

window.addEventListener( "mousemove", onMouseMove, false );
window.requestAnimationFrame(render);


function animate(){
    controls.update();
    renderer.render(scene, camera);
    requestAnimationFrame(animate);
}

function render(){

    sunArray[1].rotation.y += 0.01;
renderer.render(scene, camera);
};

【问题讨论】：

标签： three.js

【解决方案1】：

你需要让它重复调用requestAnimation帧：

window.requestAnimationFrame(render);

应该工作

【讨论】：

我已经有了，如果你的意思是在 animate 函数内部，它只会让整个浏览器冻结。
在您发布的代码 sn-p 中没有有。如果您仍然有问题，请尝试将其设为 jsfiddle

【解决方案2】：

function animate(){
 sunArray[1].rotation.y += 0.01;
    controls.update();
    renderer.render(scene, camera);
    requestAnimationFrame(animate);
}

function render(){
renderer.render(scene, camera);
};

【讨论】：

通过这样做，您现在有两个渲染器调用，这是不必要的。您只想添加到 animate 函数中的是 sunArray[1].rotation.y += 0.01; 而不是 render();
改变了，谢谢不知道。已更改为您的解决方案。