opengl - 是否可以同时使用索引和法线？

Question

我在OpenGL中遇到照明问题。当我不使用索引时，阴影看起来应为:

let cube: [f32; 324] = [
    //positions        //normals         //color
    -0.5, -0.5, -0.5,  0.0,  0.0, -1.0,  0.0, 1.0, 0.0,
     0.5, -0.5, -0.5,  0.0,  0.0, -1.0,  0.0, 1.0, 0.0,
     0.5,  0.5, -0.5,  0.0,  0.0, -1.0,  0.0, 1.0, 0.0,
     0.5,  0.5, -0.5,  0.0,  0.0, -1.0,  0.0, 1.0, 0.0,
    -0.5,  0.5, -0.5,  0.0,  0.0, -1.0,  0.0, 1.0, 0.0,
    -0.5, -0.5, -0.5,  0.0,  0.0, -1.0,  0.0, 1.0, 0.0,
    
    -0.5, -0.5,  0.5,  0.0,  0.0,  1.0,  0.0, 1.0, 0.0,
     0.5, -0.5,  0.5,  0.0,  0.0,  1.0,  0.0, 1.0, 0.0,
     0.5,  0.5,  0.5,  0.0,  0.0,  1.0,  0.0, 1.0, 0.0,
     0.5,  0.5,  0.5,  0.0,  0.0,  1.0,  0.0, 1.0, 0.0,
    -0.5,  0.5,  0.5,  0.0,  0.0,  1.0,  0.0, 1.0, 0.0,
    -0.5, -0.5,  0.5,  0.0,  0.0,  1.0,  0.0, 1.0, 0.0,
    
    -0.5,  0.5,  0.5, -1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
    -0.5,  0.5, -0.5, -1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
    -0.5, -0.5, -0.5, -1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
    -0.5, -0.5, -0.5, -1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
    -0.5, -0.5,  0.5, -1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
    -0.5,  0.5,  0.5, -1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
    
     0.5,  0.5,  0.5,  1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
     0.5,  0.5, -0.5,  1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
     0.5, -0.5, -0.5,  1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
     0.5, -0.5, -0.5,  1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
     0.5, -0.5,  0.5,  1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
     0.5,  0.5,  0.5,  1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
    
    -0.5, -0.5, -0.5,  0.0, -1.0,  0.0,  0.0, 1.0, 0.0,
     0.5, -0.5, -0.5,  0.0, -1.0,  0.0,  0.0, 1.0, 0.0,
     0.5, -0.5,  0.5,  0.0, -1.0,  0.0,  0.0, 1.0, 0.0,
     0.5, -0.5,  0.5,  0.0, -1.0,  0.0,  0.0, 1.0, 0.0,
    -0.5, -0.5,  0.5,  0.0, -1.0,  0.0,  0.0, 1.0, 0.0,
    -0.5, -0.5, -0.5,  0.0, -1.0,  0.0,  0.0, 1.0, 0.0,
    
    -0.5,  0.5, -0.5,  0.0,  1.0,  0.0,  0.0, 1.0, 0.0,
     0.5,  0.5, -0.5,  0.0,  1.0,  0.0,  0.0, 1.0, 0.0,
     0.5,  0.5,  0.5,  0.0,  1.0,  0.0,  0.0, 1.0, 0.0,
     0.5,  0.5,  0.5,  0.0,  1.0,  0.0,  0.0, 1.0, 0.0,
    -0.5,  0.5,  0.5,  0.0,  1.0,  0.0,  0.0, 1.0, 0.0,
    -0.5,  0.5, -0.5,  0.0,  1.0,  0.0,  0.0, 1.0, 0.0,
];

使用索引时，不会得到相同的结果:

let cube: [f32; 72] = [
    //positions        //normals         //colors
    -0.5,  0.5, -0.5,  0.0,  1.0,  0.0,  0.0, 0.0, 1.0,
    -0.5, -0.5, -0.5,  0.0,  1.0,  0.0,  0.0, 0.0, 1.0,
     0.5, -0.5, -0.5,  0.0,  1.0,  0.0,  0.0, 0.0, 1.0,
     0.5,  0.5, -0.5,  0.0,  1.0,  0.0,  0.0, 0.0, 1.0,

    -0.5,  0.5,  0.5,  0.0, -1.0,  0.0,  0.0, 0.0, 1.0,
    -0.5, -0.5,  0.5,  0.0, -1.0,  0.0,  0.0, 0.0, 1.0,
     0.5, -0.5,  0.5,  0.0, -1.0,  0.0,  0.0, 0.0, 1.0,
     0.5,  0.5,  0.5,  0.0, -1.0,  0.0,  0.0, 0.0, 1.0,
];

let cube_indices: [i32; 36] = [
    0, 1, 2,
    2, 3, 0,
    4, 5, 6,
    6, 7, 4,
    4, 0, 3,
    3, 7, 4,
    5, 1, 2,
    2, 6, 5,
    0, 1, 5,
    5, 4, 0,
    3, 2, 6,
    6, 7, 3,
];

我的着色器来自“学习OpenGL”教程:

vertex shader

fragment shader

Answer 1

是的当然。顶点坐标和法线向量形成具有6个分量(x，y，z，nx，ny，nz)的元组。这6个分量相等的顶点在多维数据集的不同侧都没有使用，因此无法在多维数据集侧之间按索引共享顶点。索引只能用于“平滑”网格，其中所有顶点属性对于相邻图元(例如球体)都是相同的。
无论如何，您可以为立方体的每一侧创建4个顶点元组:

let cube: [f32; 216] = [
    //positions        //normals         //color
    -0.5, -0.5, -0.5,  0.0,  0.0, -1.0,  0.0, 1.0, 0.0,
     0.5, -0.5, -0.5,  0.0,  0.0, -1.0,  0.0, 1.0, 0.0,
     0.5,  0.5, -0.5,  0.0,  0.0, -1.0,  0.0, 1.0, 0.0,
    -0.5,  0.5, -0.5,  0.0,  0.0, -1.0,  0.0, 1.0, 0.0,
    
    -0.5, -0.5,  0.5,  0.0,  0.0,  1.0,  0.0, 1.0, 0.0,
     0.5, -0.5,  0.5,  0.0,  0.0,  1.0,  0.0, 1.0, 0.0,
     0.5,  0.5,  0.5,  0.0,  0.0,  1.0,  0.0, 1.0, 0.0,
    -0.5,  0.5,  0.5,  0.0,  0.0,  1.0,  0.0, 1.0, 0.0,
    
    -0.5,  0.5,  0.5, -1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
    -0.5,  0.5, -0.5, -1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
    -0.5, -0.5, -0.5, -1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
    -0.5, -0.5,  0.5, -1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
    
     0.5,  0.5,  0.5,  1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
     0.5,  0.5, -0.5,  1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
     0.5, -0.5, -0.5,  1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
     0.5, -0.5,  0.5,  1.0,  0.0,  0.0,  0.0, 1.0, 0.0,
    
    -0.5, -0.5, -0.5,  0.0, -1.0,  0.0,  0.0, 1.0, 0.0,
     0.5, -0.5, -0.5,  0.0, -1.0,  0.0,  0.0, 1.0, 0.0,
     0.5, -0.5,  0.5,  0.0, -1.0,  0.0,  0.0, 1.0, 0.0,
    -0.5, -0.5,  0.5,  0.0, -1.0,  0.0,  0.0, 1.0, 0.0,
     
    -0.5,  0.5, -0.5,  0.0,  1.0,  0.0,  0.0, 1.0, 0.0,
     0.5,  0.5, -0.5,  0.0,  1.0,  0.0,  0.0, 1.0, 0.0,
     0.5,  0.5,  0.5,  0.0,  1.0,  0.0,  0.0, 1.0, 0.0,
    -0.5,  0.5,  0.5,  0.0,  1.0,  0.0,  0.0, 1.0, 0.0,
];

并为立方体的每一侧指定6个索引(2个三角形):

let cube_indices: [i32; 36] = [
     0,  1,  2,     0,  2,  3,
     4,  5,  6,     4,  6,  7,
     8,  9, 10,     8, 10, 11,
    12, 13, 14,    12, 14, 15,
    16, 17, 18,    16, 18, 19,
    20, 12, 22,    20, 22, 23,
];