在three.js docs中，它说以下用于创建Face3
//create a triangular geometry
var geometry = new THREE.Geometry();
geometry.vertices.push( new THREE.Vector3( -50, -50, 0 ) );
geometry.vertices.push( new THREE.Vector3( 50, -50, 0 ) );
geometry.vertices.push( new THREE.Vector3( 50, 50, 0 ) );
//create a new face using vertices 0, 1, 2
var normal = new THREE.Vector3( 0, 1, 0 ); //optional
var color = new THREE.Color( 0xffaa00 ); //optional
var materialIndex = 0; //optional
var face = new THREE.Face3( 0, 1, 2, normal, color, materialIndex );
0, 1, 2是多少？它们是如何填充的？它在评论中字面意思是使用顶点 0、1、2 创建一个面，但这里的数字如何：
var normal = new THREE.Vector3( 0, 1, 0 ); //optional
^ ^ ^
从上面的几何填充？我看不到上面的顶点是从哪里传入的。稍后我们有更多的数字。我想它们可能是normal这个函数中参数的索引。
var face = new THREE.Face3( 0, 1, 2, normal, color, materialIndex );
^ ^ ^
第一个
var normal = new THREE.Vector3( 0, 1, 0 ); //optional
– 甚至不传递geometry变量。而且我也不确定为什么第一个使用0, 1, 0而第二个使用0, 1, 2
我是 Three.js 的新手，很难理解一切是如何协同工作的。
数字0,1,2称为索引。三角形几何可以用两种方式表示 - 索引和“三角形汤”。
三角汤不需要索引，它只是顶点的集合。
const vertices = [
vert0,
vert1,
vert2,
vert0, //notice it's mentioned again
vert3,
vert1, //same here
]
这六个顶点可以描述两个三角形。vert0和vert1被提及两次，但在缓冲区中它们被扩展。所以如果你有一些类似的值[0,0,0]，[1,1,0]你会重复这些数字两次。这被称为三角汤，因为每个三角都有自己的描述。
为了节省一些内存，我们可以这样描述相同的几何：
const vertices = [
vert0,
vert1,
vert2,
vert3
]
注意这里没有重复，不是 6 个顶点描述 2 个三角形，我们只提供了 4 个。我们如何得到相同数量的三角形？使用索引：
const indices= [
0,
1,
2,
0,
3,
1
]
我们现在可以索引 4 个顶点而无需复制它们。
当描述像立方体这样的东西时，事情会变得复杂。一个三角形汤立方体将有 36 个顶点。如果这是假设，索引的不会有 8，它需要 24。可以共享人脸的对角线，因此可以两次提及同一个顶点。然而，在边缘我们需要两个不同的顶点来引用两个不同的法线。即使顶点的值相同，它们也必须在一个缓冲区中重复，以便可以正确寻址包含两个唯一条目的普通缓冲区。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句