Wavefront文件转换为WebGL数组在某处出错了

Question

我正在创建一个WebGL图形库，但是无法从OBJ Wavefront创建正确的数组（这绝对是正确的）。看起来很简单，需要修复但无法找到它。想知道是否有人可能会认识到这种类型的错误。

您可以在此处查看实时示例： http://robjte.de/webgl/8-3d.html

以下是我怀疑导致此问题的功能。

function objectify (str) {
    var vertexRegex = /^v(?:\s(-?\d+.?(?:\d+)?))\s(-?\d+.?(?:\d+)?)\s(-?\d+.?(?:\d+)?)$/gim;
    var faceRegex = /^f\s(\d+)\s(\d+)\s(\d+)$/gim;
    var commentRegex = /^\s*\#.*$/gim;
    var emptyLineRegex = /^$/gim;

    var vertices = [];
    var faces = [];

    var m, i = 0;
    while (m = faceRegex.exec(str)) {
        faces.push([m[1], m[2], m[3]]);
        i++;
    }

    var m, i = 0;
    while (m = vertexRegex.exec(str)) {
        vertices.push([m[1], m[2], m[3]]);
        i++;
    }

    return {vertices: vertices, faces: faces};
}

function facesVerticesToWebGL (obj) {
    var f = obj.faces;
    var v = obj.vertices;

    var arr = [];
    f.forEach(function (val) {
        var vArr = v[parseInt(val) - 1];
        vArr.forEach(function (val2) {
            arr.push(parseFloat(val2));
        });
    });

    return arr;
}

Answer 1

我不知道您的代码到底出了什么问题，但这里有一个very nicely commented版本，所以请查看一下，看看差异在哪里。

Answer 2

我使用三重forEach块修复它。我的错误是vArr是一个数组，而parseInt只导致第一个值被使用，所以我只绘制了所需顶点的三分之一。