Question

使用webgl中的像素数据绘制纹理时，不会渲染纹理。对象显示为白色。有人能指出我在下面的代码中的错误吗？

 function handleLoadedTexture(texture ) {
    gl.bindTexture(gl.TEXTURE_2D, texture);
    gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true);
    gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 16,16,0, gl.RGBA, gl.UNSIGNED_BYTE, texture.data);
    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
    gl.bindTexture(gl.TEXTURE_2D, null);
    try{
    }
    catch(e){       
            console.log("Error : "+ e.name + "\n"+ e.message);
            console.log(gl.getError());
    }
}


var neheTexture;
var data;
function initTexture() {
    neheTexture = gl.createTexture();

    data =[];
    for(var i=0;i<256*4;i++)
    {       
            if(i%4==0 || i%4==3)
                    data[i] = 1;
            else data[i] =0;
    }
    neheTexture.data =  new Uint8Array(data);

}

Answer 1

问题几乎肯定在你的绘图代码中，所以请发布，但有一件事我想指出：

您正在使用红色和Alpha通道设置为1来初始化纹理，但我很确定这不符合您的想法。像这样的纹理数据以字节为单位，其值范围为0-255。这意味着1，而不是像你想象的那样意味着“全强度”，实际上是1/256强度（从0到1的等级为0.004）。这意味着您的代码生成了几乎完全透明且仅略带红色的着色纹理。

如果你想要完全不透明的红色，你实际上想要像你这样做你的循环：

for(var i=0; i<256*4; i++) {       
        if(i%4==0 || i%4==3)
            data[i]=255;
        else 
            data[i]=0;
}

使用未呈现的像素数据的webgl纹理

1 个答案: