索引的顺序重要吗？

Question

this._vertices = new Float32Array([
            -0.5, 0, 0, // left
            0, 0.5, 0, // top
            0.5, 0, 0 // right
        ]);

this._indicies = new Uint16Array([0, 1, 2]);

如您所见，三角形有 3 个点。这个问题是我的三角形最终不会被渲染，除非我将索引更改为

this._indicies = new Uint16Array([0, 2, 1]);

你知道这是为什么吗？为什么索引的顺序很重要？我怎么知道放置索引的正确顺序？

Ps。将绘图类型设置为 LINE_LOOP 时有效，但不适用于三角形。

Answer 1

如果剔除开启 gl.enable(gl.CULL_FACE)，则如果三角形的顶点在剪辑 space 中逆时针旋转（即在顶点着色器之后），则三角形将被剔除。您可以选择用 gl.cullFace(...)

剔除顺时针或逆时针的三角形

     0             0
    / \           / \
   /   \         /   \
  2-----1       1-----2

clockwise   counter-clockwise

Answer 2

如果启用面剔除，顶点顺序确实很重要。三角形的正面和背面取决于设置的缠绕顺序。如果启用逆时针缠绕（默认设置），则顶点以逆时针顺序出现在屏幕上的面被视为 "front" 面。

如果启用剔除，则只会绘制您从选定边看的三角形。

索引的顺序重要吗？

Does the order of indices matter?

javascript

vertices

webgl

indices