Three.js開始和停止一個簡單的網格

我對Three.js和WebGL仍然很陌生，但是我想更好地理解它。你能否請我的代碼找到解決方案，我爲自己設置了一個相當簡單的問題。如何將一個簡單的400 x 400 PLANE MESH從y位置500（在瀏覽器窗口下）移動到x，y，z位置0（瀏覽器窗口的中心）的動畫效果） - 沒有使用Tween.js？我知道Tween.js for Three.js對簡單的動作非常有效，但我想找到一個涉及學習的解決方案。使用Tween.js，我什麼也學不到。是的，我在StackOverflow和GobHub上的Doob的代碼存儲庫上進行了幾個小時的研究。在經過非常廣泛的搜索之後，我無法找到一個能夠完全滿足我需要的解決方案，namley：一個簡單的垂直向上動畫，在瀏覽器窗口的中心從幀和停止開始。Three.js開始和停止一個簡單的網格

我的解決方案：

 `function animate() { 
     var newPos = plane.position.y; 
     plane.translateY(4); 
     function stopHere() { 
      if (newPos >= 0) 
      { 
       plane.position.set(0, 0, 0); 
       var stopPlane = plane.position.y = 0; 
      } 
     } 
     requestAnimationFrame(stopHere); 
    } 

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

我已經張貼只是兩個函數做所有的工作。有人在那裏看到不好的做法嗎？我的邏輯是

不能在渲染（）;功能，因爲它需要內

`animate();`

我碰到了困難，從這個方向接近它是嵌套函數（「stopHere」）的範圍內：

`objMesh.geometry.applyMatrix(new THREE.Matrix4().makeTranslation(1, 0.1, 0.1)); `

簡單的東西摔跤後一個星期以來，我只知道它的工作原理。據我的理解，我已經使用了applyMatrix子類的方法並使其工作。我在徵求意見，因爲我想學習Three.js，而不是壞習慣。請問，有沒有人看到不好的做法或錯誤的編碼？非常感謝。

ksqInFlight

來源

2016-05-31 ksqInFlightM

你可能會得到[代碼審查]一個更好的答案（HTTP：//codereview.stackexchange .com /）或可能[Game Dev]（http://gamedev.stackexchange.com/）。 – ManoDestra

我是老年人，所以我的做法是，在你的requestAnimationFrame循環：

function fnloop() { 
    var dy = Math.min(Math.abs(plane.position.y), .01); // max movement 
    if (Math.abs(dy) >= .000001) { 
    if (plane.position.y > 0) dy = -dy; // move down if above 
    plane.position.y += dy; // move up or down 
    if (Math.abs(plane.position.y) < .000001) alert("Done!"); 
    } 
    renderer.render(scene, camera); 
    requestAnimationFrame(fnloop); 
}

來源

2016-06-01 00:02:49 dcromley

Three.js開始和停止一個簡單的網格

回答

相關問題