WebGL正交相机

时间:2014-06-10 17:41:10

标签: webgl orthographic

有人可以帮助我使用以下代码:

gl.viewport(0, 0, gl.viewportWidth, gl.viewportHeight);
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
mat4.ortho(pMatrix, 0, gl.viewportWidth, 0, gl.viewportHeight, 0.1, 100);
mat4.identity(mvMatrix);
mat4.lookAt(mvMatrix, [0, 0, -40], [0, 0, 0], [0, 1, 0]);

完整来源http://jsfiddle.net/bepa/2QXkp/

我试图用正交相机显示立方体,但我看到的只是黑色。立方体应位于(0,0,0),摄像机(0,0,-40)并查看(0,0,0)。

对于所有矩阵变换,我使用gl-matrix 2.2.0。

编辑:

这很好用:

mat4.perspective(pMatrix, 45, gl.viewportWidth / gl.viewportHeight, 0.1, 100.0);
mat4.identity(mvMatrix);
mat4.lookAt(mvMatrix, [0, 40, -40], [0, 0, 0], [0, 1, 0]);
mat4.rotate(mvMatrix, mvMatrix, degToRad(45), [0, 1, 0]);

这不起作用:

mat4.ortho(pMatrix, 0, gl.viewportWidth, 0, gl.viewportHeight, 0.1, 100);
mat4.identity(mvMatrix);
mat4.lookAt(mvMatrix, [0, 40, -40], [0, 0, 0], [0, 1, 0]);
mat4.rotate(mvMatrix, mvMatrix, degToRad(45), [0, 1, 0]);

1 个答案:

答案 0 :(得分:5)

 mat4.ortho(pMatrix, -1.0, 1.0, -1.0, 1.0, 0.1, 100);

给出非黑色的结果;)

mat4.ortho()的文档:

/**
 * Generates a orthogonal projection matrix with the given bounds
 *
 * @param {mat4} out mat4 frustum matrix will be written into
 * @param {number} left Left bound of the frustum
 * @param {number} right Right bound of the frustum
 * @param {number} bottom Bottom bound of the frustum
 * @param {number} top Top bound of the frustum
 * @param {number} near Near bound of the frustum
 * @param {number} far Far bound of the frustum
 * @returns {mat4} out
 */
mat4.ortho = function (out, left, right, bottom, top, near, far) {

正射投影不需要画布的宽度和高度。但我对投影矩阵不够熟悉,无法深入解释原因。