Question

我刚刚阅读了这个mozilla WebGL教程并提出了一个问题 https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/Tutorial/Adding_2D_content_to_a_WebGL_context

我想知道为什么一个简单方块的位置数组应该是

const positions = [
    -1.0,  1.0, // 1 - top left
     1.0,  1.0, // 2 - top right
    -1.0, -1.0, // 3 - bottom left
     1.0, -1.0, // 4 - bottom right
];

而不是

const positions = [
    -1.0,  1.0, // 1 - top left
     1.0,  1.0, // 2 - top right
     1.0, -1.0, // 4 - bottom right
    -1.0, -1.0, // 3 - bottom left
];

对我来说更有意义。

在第一种情况下（正确的），似乎从顶点到顶点绘制正方形的线应该交叉，但显然它不会那样工作。

Answer 1

他们在该示例中使用TRIANGLE_STRIP索引：

使用顶点v0绘制一系列三角形（三边形多边形）， v1，v2，然后是v2，v1，v3（注意顺序），然后是v2，v3，v4，依此类推。排序是为了确保三角形全部用相同的方向，以便条带可以正确地形成一部分表面上。

Wikipedia - Triangle strip

WebGL顶点数组顺序

1 个答案: