Question

我开始通过阅读Apress的Beginning WebGl for HTML5来学习webgl，它建议使用gl-matrix.js来处理矩阵操作，当使用mat4.translate函数时具有以下实现

mat4.translate = function (out, a, v) {
    var x = v[0], y = v[1], z = v[2],
    a00, a01, a02, a03,
    a10, a11, a12, a13,
    a20, a21, a22, a23;

if (a === out) {
    out[12] = a[0] * x + a[4] * y + a[8] * z + a[12];
    out[13] = a[1] * x + a[5] * y + a[9] * z + a[13];
    out[14] = a[2] * x + a[6] * y + a[10] * z + a[14];
    out[15] = a[3] * x + a[7] * y + a[11] * z + a[15];
} else {
    a00 = a[0]; a01 = a[1]; a02 = a[2]; a03 = a[3];
    a10 = a[4]; a11 = a[5]; a12 = a[6]; a13 = a[7];
    a20 = a[8]; a21 = a[9]; a22 = a[10]; a23 = a[11];

    out[0] = a00; out[1] = a01; out[2] = a02; out[3] = a03;
    out[4] = a10; out[5] = a11; out[6] = a12; out[7] = a13;
    out[8] = a20; out[9] = a21; out[10] = a22; out[11] = a23;

    out[12] = a00 * x + a10 * y + a20 * z + a[12];
    out[13] = a01 * x + a11 * y + a21 * z + a[13];
    out[14] = a02 * x + a12 * y + a22 * z + a[14];
    out[15] = a03 * x + a13 * y + a23 * z + a[15];
}

return out;

};

通过以下电话

mat4.translate(mvMatrix,[0, 0, -2.0]);

我收到以下错误：“无法读取未定义的属性0”，当它尝试分配vec3 v组件时给出。

有任何帮助吗？此致

Answer 1

本书使用的glMatrix版本可能是1.3.7，而最近发布的版本是2.1.0。从2.0开始，界面已经改变了一致性，与你在书中看到的不一致。

如果您想使用最新最好的glMatrix，您需要参考documentation来获取正确的参数。否则只需下载1.3.7并按照本书描述的那样使用它。

Answer 2

更新gl-matrix中的新API：

mat4.perspective(pMatrix, 45, canvas.width / canvas.height, 0.1, 100.0);                                                               
mat4.identity(mvMatrix);                                     
mat4.translate(mvMatrix, mvMatrix, [0, 0, -2.0]);

Answer 3

OLD API：gl-matrix-1.x

mat4.perspective(45, gl.viewportWidth / gl.viewportHeight, 0.1, 100.0, pMatrix);
mat4.identity(mvMatrix);
mat4.translate(mvMatrix, [-1.5, 0.0, -7.0]);

新API：gl-matrix-2.x

mat4.perspective(pMatrix, 45, canvas.width / canvas.height, 0.1, 100.0);                                                               
mat4.identity(mvMatrix);
mat4.translate(mvMatrix, mvMatrix, [-1.5, 0.0, -7.0]);

Answer 4

是的，我遇到了与最新glmatrix.min.js相同的问题。但是，在使用https://www.versioneye.com/javascript/toji:gl-matrix/1.3.7的ver 1.3.7之后，它已经解决了。

在webgl应用程序中，gl-matrix“无法读取未定义的属性0”

4 个答案: