WebGL中的透明颜色纹理

时间:2016-08-04 14:27:55

标签: javascript textures webgl rgba

我使用以下代码从浮点数组中创建RGBA纹理:

var dataTexture = new Uint8Array(array.length*4);
for(var i=0; i<dataTexture.length; i+=4)
{

    if(array[i/4]!=0)
    {
        dataTexture[i] = 255*parseFloat(array[i/4]);
        dataTexture[i+1] = 255*parseFloat(array[i/4]);
        dataTexture[i+2] = 255*parseFloat(array[i/4]);
        dataTexture[i+3] = 255;
    }
}

gl.bindTexture(gl.TEXTURE_2D, self.mTexture);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 512, 512, 0, gl.RGBA, gl.UNSIGNED_BYTE, dataTexture);      
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
gl.drawArrays(gl.TRIANGLES, 0, 6);

它显示为黑白图像。如何在顶部放置透明色彩图,使其看起来不是黑白,而是用彩色?我在上面的代码之前尝试了以下代码,但无济于事:

var x = new Uint8Array([55, 155, 255, 120]);
var texture = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, texture);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 1, 1, 0, gl.RGBA, gl.UNSIGNED_BYTE, x);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.CLAMP_TO_EDGE);
gl.drawArrays(gl.TRIANGLES, 0, 6);

谢谢!

0 个答案:

没有答案