移除three.js所立方

旋轉的動畫我創建從three.js所示例的3D線框立方體，但它不斷旋轉，移除three.js所立方

我想停止這個動畫。

現在，當我從腳本底部刪除animate();時，畫布不加載。

// start animation 
animate(); 
</script>

當我嘗試從刪除animate();功能：

// request new frame 
    requestAnimationFrame(function(){ 
     animate(); 
    });

動畫停止，但它需要奇怪的形狀，但不立方體的形狀。同樣在每次刷新時，它都會改變形狀。

這裏是我的代碼：

的Javascript：

<script defer="defer"> 
    // revolutions per second 
    var angularSpeed = 0.2; 
var lastTime = 0; 

// this function is executed on each animation frame 
function animate(){ 
    // update 
    var time = (new Date()).getTime(); 
    var timeDiff = time - lastTime; 
    var angleChange = angularSpeed * timeDiff * 2 * Math.PI/1000; 
    cube.rotation.y += angleChange; 
    lastTime = time; 

    // render 
    renderer.render(scene, camera); 

    // request new frame 
    requestAnimationFrame(function(){ 
     animate(); 
    }); 
} 

// renderer 
var container = document.getElementById("container"); 
var renderer = new THREE.WebGLRenderer(); 
renderer.setSize(container.offsetWidth, container.offsetHeight); 
container.appendChild(renderer.domElement); 

// camera 
var camera = new THREE.PerspectiveCamera(45, window.innerWidth/window.innerHeight, 1, 1000); 
camera.position.z = 700; 

// scene 
var scene = new THREE.Scene(); 

// cube Length, Height, Width 
var cube = new THREE.Mesh(new THREE.CubeGeometry(400, 200, 200), new THREE.MeshBasicMaterial({ 
    wireframe: true, 
    color: '#ff0000' 
})); 
cube.rotation.x = Math.PI * 0.1; 
scene.add(cube); 

// start animation 
animate(); 
</script>

下面是相同的小提琴：http://jsfiddle.net/UsEDt/1/

讓我知道如果你需要的任何其他信息。

請建議。

來源

2014-02-12 UID

要停止旋轉並保持恆定，即使刷新了，您所要做的僅僅是將角度更改的行註釋掉。此行：

//cube.rotation.y + = angleChange;

爲立方體形的問題 - 如果你真的想要一個單位立方體，則需要相應地修改你的尺寸，以及你的窗口比例。

來源

2014-02-13 02:33:02 prabindh

移除three.js所立方

回答

相關問題