Webgl/Opengl drawElements 和顶点的唯一性

Question

考虑典型的绘图调用

webgl.bindBuffer(webgl.ELEMENT_ARRAY_BUFFER, faces); 
webgl.drawElements(webgl.TRIANGLES, nfaces * 3, webgl.UNSIGNED_SHORT, 0);

现在，为了简单起见，我正在渲染一个立方体。如果每个 Vertex 的分量是它的位置 px,py,pz 和它的法线 nx,ny,nz，那么我有 8 个唯一的顶点。

然后我可以保留一个包含这 8 个顶点的缓冲区，保留另一个“面”缓冲区，其中包含每个面使用的顶点的索引，然后通过索引 drawElements 调用共享顶点。很好。

但是，当我们引入 UV 坐标时，我不再有 8 个唯一的顶点。我最终每张脸都需要三个唯一的顶点。

那么，面缓冲区也可能是 [(0,1,2), (3,4,5), (6,7,8) ... 等等]。

因此，随着顶点携带更多信息，它们变得无法共享。然而，我需要一个索引缓冲区才能调用 drawElements。一个索引缓冲区，其内容最终只是一个 0 … n​​verts-1 整数的序列。

我错过了什么吗？

Answer 1

具有位置和法线的立方体至少需要 24 个顶点。立方体每个角上的共享位置在立方体的每个面上都有不同的法线

至于索引与否，您不需要索引缓冲区。你可以打电话给gl.drawArrays而不是gl.drawElements

关于共享顶点，立方体的问题是立方体的每个面都面向不同的方向，因此需要不同的法线，并且对于具有相同位置的顶点，纹理坐标通常也不共享。但是，其他形状（球体、圆环、人、动物、杯子、盘子、瓶子、山、植物）有很多机会使用共享顶点。

还要注意有other ways of organizing vertices