在THREE.Geometry对象上设置顶点之后，THREE.Shape.Utils.triangulateShape因TypeError失败

Question

我创建了一个由THREE.JS和Physijs制作的游戏。我做了一个名为addBlock2的函数，它为场景添加了一个三角形金字塔。它设置相应的顶点，但是当涉及到triangulateShape失败，出现以下错误：

Uncaught TypeError: Cannot read property 'x' of undefined 

THREE.Shape.Utils.triangulateShape @ three.min.js:680 
Game.addBlock2   @ game.js:210 
Game.update    @ game.js:271 
(anonymous function) @ game.js:284 
onAnimationFrame  @ VM3973:49 
(anonymous function) @ VM3973:18 

game.js：210是“triangulateShape”行。

下面是代码：

Game.prototype.addBlock2 = function(x,y,z) { 
    var geometry = new THREE.Geometry(); 
    geometry.vertices = [ 
     THREE.Vector3(0,0,0), 
     THREE.Vector3(0,200,-100), 
     THREE.Vector3(100,200,100), 
     THREE.Vector3(-100,200,100) 
    ] 
    var triangles = THREE.Shape.Utils.triangulateShape(geometry.vertices, []); 
    for (i in triangles){ 
     geometry.faces[geometry.faces.length] = new THREE.Face3(triangles[i][0], triangles[i][1], triangles[i][2]) 
    } 
    geometry.computeFaceNormals(); 
    geometry.computeVertexNormals(); 
    var material = Physijs.createMaterial(new THREE.MeshPhongMaterial({color: 0xFFFF00}),0.3,0.8); 
    try { 
     var mesh = new Physijs.ConvexMesh(geometry,material); 
    } 
    catch (e) { 
     console.log(e,geometry,material) 
     return 
    } 
    mesh.position.x = x || 0 
    mesh.position.y = y || 0 
    mesh.position.z = z || 0 
    mesh.__dirtyPosition = true 
    mesh.name = "block."+(x||0)+","+(y||0)+","+(z||0) 
    mesh.receiveShadow = true 
    this.scene.add(mesh); 
    this.blocks[this.blocks.length] = mesh 
} 

Answer 1

我固定它。我应该使用new THREE.Vector3而不是THREE.Vector3。我无法让triangulateShape获得我想要的，所以我手动设置了脸部。下面是新的代码：

Game.prototype.addBlock2 = function(x,y,z) { 
    var geometry = new THREE.Geometry(); 
    geometry.vertices = [ 
     new THREE.Vector3(0,0,0), 
     new THREE.Vector3(0,200,-100), 
     new THREE.Vector3(100,200,100), 
     new THREE.Vector3(-100,200,100) 
    ] 
    geometry.faces = [ 
     new THREE.Face3(0,1,2), 
     new THREE.Face3(0,2,3), 
     new THREE.Face3(0,3,1), 
     new THREE.Face3(1,2,3) 
    ] 
    geometry.computeFaceNormals(); 
    geometry.computeVertexNormals(); 
    var material = Physijs.createMaterial(new THREE.MeshPhongMaterial({color: 0xFFFF00, side: THREE.DoubleSide}),0.3,0.8); 
    try { 
     var mesh = new Physijs.ConvexMesh(geometry,material); 
    } 
    catch (e) { 
     console.log(e,geometry,material) 
     return 
    } 
    mesh.position.x = x || 0 
    mesh.position.y = y || 0 
    mesh.position.z = z || 0 
    mesh.__dirtyPosition = true 
    mesh.name = "block."+(x||0)+","+(y||0)+","+(z||0) 
    mesh.receiveShadow = true 
    this.scene.add(mesh); 
    this.blocks[this.blocks.length] = mesh 
}