Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/419.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript three.js:face4生成三角形而不是正方形_Javascript_Geometry_Three.js - Fatal编程技术网

Javascript three.js:face4生成三角形而不是正方形

Javascript three.js:face4生成三角形而不是正方形,javascript,geometry,three.js,Javascript,Geometry,Three.js,我正在尝试使用tree.js自定义几何体生成一个正方形。 但是这个代码 var cubeGeo = new THREE.Geometry(); cubeGeo.vertices.push( new THREE.Vector3( -25, 25, -25 ) ); cubeGeo.vertices.push( new THREE.Vector3( 25, 25, -25 ) ); cubeGeo.vertices.push( new THREE.Vector3( -25, -25, -25

我正在尝试使用tree.js自定义几何体生成一个正方形。 但是这个代码

var cubeGeo = new THREE.Geometry();
cubeGeo.vertices.push( new THREE.Vector3( -25,  25, -25 ) );
cubeGeo.vertices.push( new THREE.Vector3(  25,  25, -25 ) );
cubeGeo.vertices.push( new THREE.Vector3( -25, -25, -25 ) );
cubeGeo.vertices.push( new THREE.Vector3(  25,  -25, -25 ) );
cubeGeo.faces.push( new THREE.Face4( 0, 1, 2, 3, new THREE.Vector3( 0,  0,  1 ), 0xffffff, 0) );

    var cube = new THREE.Mesh(
  cubeGeo,  
  //new THREE.CubeGeometry(50, 50, 50),
  new THREE.MeshPhongMaterial({color: 0x696969, emissive: 0x696969, specular:0x696969, shininess: 15})
);
生成三角形
有人能解释一下为什么会这样吗?

事实上,它应该画个蝴蝶结之类的东西。顶点顺序不正确。交换最后两个顶点

问题出在三面脸上。它已在上一版本中删除。在这方面,我们可以阅读:

r59->r60

面4已移除。使用2个面3来模拟它

你看到三角形而不是正方形的原因是:

THREE.Face4 = function ( a, b, c, d, normal, color, materialIndex ) {

    return new THREE.Face3( a, b, c, normal, color, materialIndex );

};

Three.Face4已被弃用

下面是如何使用2
Face3
制作正方形:

function drawSquare(x1, y1, x2, y2) { 

    var square = new THREE.Geometry(); 

    //set 4 points
    square.vertices.push( new THREE.Vector3( x1,y2,0) );
    square.vertices.push( new THREE.Vector3( x1,y1,0) );
    square.vertices.push( new THREE.Vector3( x2,y1,0) );
    square.vertices.push( new THREE.Vector3( x2,y2,0) );

    //push 1 triangle
    square.faces.push( new THREE.Face3( 0,1,2) );

    //push another triangle
    square.faces.push( new THREE.Face3( 0,3,2) );

    //return the square object with BOTH faces
    return square;
}

交换了,但它现在对我来说什么也没画-这是我的完整代码,我把顶点按原来的顺序保留了下来,只是做了这把小提琴。在您上面的更新中,它可能是您正在查看的一面,因此请将其设置为
面:三。双面
以查看它。是的,但通常您不应该使用它。这是GPU上的一笔费用。这很有趣,但没有回答问题,这是关于
Face4
@ArtjomB的<不再支持代码>面4