Javascript 从图像像素到相应垂直的数据

我试着把我的脸从相机上记录下来，使它有点颠簸

我从相机上拍摄视频，并通过纹理将其放在平面上。 从facedetection中，我得到了一个类似于heightmap的灰度图像，我想从中获取像素数据并将其应用到相应的顶点，但它有点倾斜

pixeldata的长度比可用顶点的数量短，因此问题可能是正确的

目前我正在这样做，如airtightinteractive.com/demos/js/webcammesh/所示：

function getPictureData() {
    var canvas = document.getElementById('debug');
    var context = canvas.getContext('2d');

    var imgd = context.getImageData(0, 0, vidWidth, vidHeight);
    var pix = imgd.data;
    return pix;
}

function getColor(x, y, data) {
    var base = (Math.floor(y) * (vidWidth + 1) + Math.floor(x)) * 4;
    var c = {
        r: data[base + 0],
        g: data[base + 1],
        b: data[base + 2],
        a: data[base + 3]
    };
    return c.r + c.g + c.b
}

function getDepth() {
    var data = getPictureData();
    //console.log(data);
    for (var i = 0; i < vidWidth +1; i++) {
        for (var j = 0; j < vidHeight +1; j++) {
            cubeGeometry.vertices[j * (vidWidth + 1) + i].z = getColor(i,j,data)/55;
        }
    }
    cubeGeometry.verticesNeedUpdate = true;
}

函数getPictureData（）{ var canvas=document.getElementById（'debug'）； var context=canvas.getContext（'2d'）； var imgd=context.getImageData（0，0，vidWidth，vidHeight）； var pix=imgd.data； 返回pix； } 函数getColor（x、y、数据）{ var base=（数学层（y）*（vidWidth+1）+数学层（x））*4； 变量c={ r：数据[base+0]， g:数据库[base+1]， b:数据库[base+2]， a:数据[基础+3] }; 返回c.r+c.g+c.b } 函数getDepth（）{ var data=getPictureData（）； //控制台日志（数据）； 对于（变量i=0；i

---

你知道如何将一个像素与其对应的顶点进行匹配吗？

盲猜：试一下

vidWidth

而不是

vidWidth+1

@mrdoob谢谢，我刚刚注意到了评论。我早些时候试过，确实有帮助。顺便说一句，谢谢你的三点建议：）