0

更新：这段代码确实有效。我的错误是对glViewport; 这似乎是浏览器窗口锚定的，而不是 webGL 中的画布相关的，它把所有东西都推到了屏幕外。所以这个问题中的代码显示了如何为 WebGL 创建正确的正交投影：

webGL 没有gluOrtho2D. 我已经复制 - 并转置，因为 OpenGL 矩阵应该是 - 从glOrtho：

function createOrtho2D(left,right,bottom,top) {
    var near = -1, far = 1, rl = right-left, tb = top-bottom, fn = far-near;
    return [        2/rl,                0,              0,  0,
                       0,             2/tb,              0,  0,
                       0,                0,          -2/fn,  0,
        -(right+left)/rl, -(top+bottom)/tb, -(far+near)/fn,  1];
}

然后我使用createOrtho2D(0,canvas.offsetWidth,canvas.offsetHeight,0).

例如，createOrtho2D(0,1024,768,0)=

[ 0.001953125,                      0,  0,  0, 
            0, -0.0026041666666666665,  0,  0, 
            0,                      0, -1,  0, 
           -1,                      1,  0,  1]

我上传这个gl.uniformMatrix4fv(this.program.mvp,false,mvp);并在顶点着色器中应用它gl_Position = mvp * vec4(vertex,z,1.0);。

但是，这不起作用：

  • 点 10,10 在屏幕上不可见
  • 点 10,100 就在屏幕顶部

我做错了什么？

4

0 回答 0