THREE.JS面向對象的結構問題

我爲我的一個課程製作了THREE.JS遊戲。我非常熱衷於學習和理解THREE.JS，所以我跟着他們的一些教程學習了Javascript。我更像是一個C＃和C++的人，所以下面的問題可能只是我對JavaScript的理解缺乏的結果。THREE.JS面向對象的結構問題

我寫了以下面向對象的遊戲結構。

ObjectEnum = { 
      Cube: 0, 
      Sphere: 1, 
      Cylinder: 2 
     } 



     Transform = function() { 
      var position, rotation, scale; 
     } 

     function TransformInit(position, rotation, scale) { 
      var t = new Transform(); 
      t.position = position; 
      t.rotation = rotation; 
      t.scale = scale; 
      return t; 
     } 

     GameObject = function() { 
      var mesh, geometry, material, transform; 
      var GameObject = this; 
      this.init = function (ObjectEnumType, materialShader, transformVector3) { 
       if (ObjectEnumType == 0) { 
        geometry = new THREE.BoxGeometry(transformVector3.scale); 
       } 
       transform = transformVector3; 
       material = materialShader; 
       mesh = new THREE.Mesh(geometry, material); 
      } 
      this.getMesh = function() { 
       return mesh; 
      } 
     } 

     var go = new GameObject(); 
     this.onload = function() { 
      var scene = new THREE.Scene(); 
      var camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000); 

      var renderer = new THREE.WebGLRenderer(); 
      renderer.setSize(window.innerWidth, window.innerHeight); 
      document.body.appendChild(renderer.domElement); 
      var t = TransformInit(new THREE.Vector3(10, 0, 0), new THREE.Vector3(10, 0, 0), new THREE.Vector3(1, 1, 1)); 

      go.init(ObjectEnum.Cube, new THREE.MeshPhongMaterial({ 
       specular: '#a9fcff', 
       color: '#00abb1', 
       emissive: '#006063', 
       shininess: 100 
      }), t); 
      var w = go.getMesh(); 
      scene.add(w); 
      camera.position.z = 5; 
      console.log(t); 
      var render = function() { 
       requestAnimationFrame(render); 
       renderer.render(scene, camera); 
      }; 
      render(); 
     }

顯然，它不會在屏幕上顯示任何東西。我使用了一個調試器，發現一切都有非零值，沒有控制檯錯誤，所有THREE.JS腳本在這之前加載，編輯器中的事情都很好，但屏幕上沒有任何東西。當我將其改爲簡單的程序結構時，它就可以工作。在我的代碼中是否存在問題，或者在實現中是否存在我缺少的JS概念？

從這裏 http://threejs.org/docs/#Manual/Introduction/Creating_a_scene http://blog.teamtreehouse.com/the-beginners-guide-to-three-js

跟着教程不上IE11，Chrome瀏覽器，Firefox的工作！

來源

2015-04-15 Rushabh

有一行看起來很奇怪，我這是：「VAR遊戲對象=本;」。這條線是做什麼的？ – mwarren

這是不可能的，這個來源有什麼問題。整個腳本的入口點是'this.onload = function'。但是我看不到從哪裏來的地方，我們也不知道這是什麼。所以，請澄清你的問題。 –

最後一個函數中的「this」是什麼？ – Martin

您已將不正確的參數傳遞給BoxGeometry。 transformVector3的Vector3是這樣，你應該寫：

幾何=新THREE.BoxGeometry（transformVector3.scale.x， transformVector3.scale.y， transformVector3.scale.z）;

位置沒有分配給你的目：

  transform = transformVector3; 
      material = materialShader; 
      mesh = new THREE.Mesh(geometry, material); 
      //here 
      mesh.position.copy(transform.position);

來源

2015-04-16 20:10:29 Rendolf

THREE.JS面向對象的結構問題

回答

相關問題