Three.js創建自定義網格失敗

我期待在three.js中創建d10的自定義網格。我想我已經正確設置了大部分（創建頂點，將頂點綁定到面），但是當我嘗試computeFaceNormals（）時，我接觸到一個未捕獲的類型錯誤（無法讀取未定義的屬性'x'）。代碼如下：Three.js創建自定義網格失敗

function newDie10(){ 
    var geom = new THREE.Geometry(); 

//Add the top & bottom vertices of the die 

    geom.vertices.push(new THREE.Vector3(0,0,1)); 
    geom.vertices.push(new THREE.Vector3(0,0,-1)); 

    var z = .1; 

//Add the outer rim of vertices 
//half above the midline and half below 

    for(var angle=0; angle <360; angle+=36){ 
     var vert = new THREE.Vector3(Math.cos(angle),Math.sin(angle),z); 
     geom.vertices.push(vert); 
     console.log(vert.x," ",vert.y," ",vert.z); 
     z = z*-1; 
    } 

//Each face is split into two triangles 
//final, combined face is diamond-shaped 
    geom.faces.push(new THREE.Face3(0,2,4)); //1 
    geom.faces.push(new THREE.Face3(2,3,4)); //1 

    geom.faces.push(new THREE.Face3(0,4,6)); //2 
    geom.faces.push(new THREE.Face3(4,5,6)); //2 

// Some similar code omitted for readability 

    geom.faces.push(new THREE.Face3(1,9,11)); //9 
    geom.faces.push(new THREE.Face3(9,10,11)); //9 

    geom.faces.push(new THREE.Face3(1,11,3)); //0 
    geom.faces.push(new THREE.Face3(11,12,3)); //0 

//The error occurs here 
    geom.computeFaceNormals(); 

    return new Physijs.ConvexMesh(geom, new Physijs.createMaterial(new THREE.MeshPhongMaterial({color: 0x005588}), .5, .3), 1); 
}

來源

2015-05-10 UrhoKarila

也許出來的東西array.I的界猜測，只有12 vertices.So'12'將是錯誤 – aboutqx

你正在兩個錯誤：

首先，Math.cos和Math.sin採用弧度作爲參數，而不是360度的角。解決方法是將angle轉換爲弧度：

var angleInRadians = angle/180 * Math.PI; 
var vert = new THREE.Vector3(Math.cos(angleInRadians), 
Math.sin(angleInRadians), z);

此外，頂點索引在最後一個面中是錯誤的。索引12不存在，因爲頂點索引是基於零的。

geom.faces.push(new THREE.Face3(11,12,3)); // These are wrong

我已經測試你的代碼，而這些都是正確的指標：

geom.faces.push(new THREE.Face3(11,2,3)); // These are right

來源

2017-08-21 14:21:58

Three.js創建自定義網格失敗

回答

相關問題