WebGL texture Y轴翻转

WebGL-Y轴翻转踩坑实录 (juejin.cn)

• 正常图片展示如下
• 顶点数据如下

float vertices[] = {
    // positions          // colors           // texture coords
     0.5f,  0.5f, 0.0f,   1.0f, 0.0f, 0.0f,   1.0f, 1.0f, // top right
     0.5f, -0.5f, 0.0f,   0.0f, 1.0f, 0.0f,   1.0f, 0.0f, // bottom right
    -0.5f, -0.5f, 0.0f,   0.0f, 0.0f, 1.0f,   0.0f, 0.0f, // bottom left
    -0.5f,  0.5f, 0.0f,   1.0f, 1.0f, 0.0f,   0.0f, 1.0f  // top left 
};

• 程序运行如下

// 1表示翻转，0表示不翻转
gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, 1);