javascript - Wavefront 文件到 WebGL 数组的转换在某处出错

标签 javascript canvas opengl-es webgl

我正在制作一个 WebGL 图形库,但在从 OBJ Wavefront 创建正确的数组时遇到问题(这绝对是正确的)。看起来是一个很容易修复的错误,但找不到它。想知道是否有人会认识到这种类型的错误。

Teapot with wrong faces

您可以在此处查看实时示例: 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;
}

最佳答案

我不知道你的代码到底出了什么问题,但这里有一个 very nicely commented版本,所以也许看一下它,看看差异在哪里。

关于javascript - Wavefront 文件到 WebGL 数组的转换在某处出错,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27068334/

相关文章:

javascript - 如何在 JavaScript 中使用不同的参数第二次调用生成器函数?

Android Canvas.drawPicture 不适用于带有 Ice Cream Sandwich 的设备

optimization - OpenGL ES 2.0 : Seeking VBO Performance/Optimisation Tips For Many Moving Vertices

javascript - 从返回的数组中获取变量

javascript - Lodash 和 Angular : Transform JSON object into view model

javascript - 拖动放置在 Canvas 中的缩放图像

android - 有关 Android 3D 的初学者问题

javascript - 如何使用 Javascript 获取 OpenGL 版本?

javascript - 使 <li> 在面板组和列表组中可选择

javascript - Paper.js 中动态生成的可移动矢量形状