多维数据集中的WebGL三角形

Question

在this tutorial作者中，通过定义6个面（6 * 4个顶点）然后告诉webgl每个面中的三角形来显示一个立方体。

这不是浪费吗？仅仅定义8个顶点并告诉webgl如何将它们连接起来获取三角形不是更好吗？多个顶点共享的颜色是否有问题？

让我的关注明显：如果作者用indices数组定义三角形，为什么他需要这么多顶点？他可以指定顶点数组中只有8个顶点的所有三角形。

Answer 1

这里的例子的作者。正如您所怀疑的那样，问题在于立方体的着色。

最容易理解这种代码的方法是将WebGL的“顶点”视为空间中的简单点，而不是属性束。特定的顶点可能是束＆lt;（1，-1,1），红色＆gt;。就WebGL而言，位于空间中相同点但具有不同颜色（例如，<＆lt;（1，-1,1），green＆gt;）的不同顶点将完全是不同的顶点。

因此，虽然一个立方体在空间中的点的数学意义上只有8个顶点，但如果你想在每个面上有不同的颜色，那么每个点必须被三个不同的顶点占据，每个颜色一个 - 这使得WebGL意义上的8x3 = 24个顶点。

就内存而言，它并不是非常高效，但与CPU功率相比，内存便宜，而且更加规范化的表示需要高效处理。

希望澄清事情。

Answer 2

您可以使用顶点缓冲区对象（VBO）。请参阅this示例。它们创建了一个顶点列表和一个“指向”顶点的索引列表（没有重复的顶点）。