【问题标题】:WebGL 1D texture - shader value catchWebGL 1D 纹理 - 着色器值捕获
【发布时间】:2013-11-15 13:00:57
【问题描述】:

所以我正在使用 WebGL 中的 GPU 着色器进行计算—— 在代码的 javascript 部分中,我将预先计算的值放入一个数组中,以作为纹理发送,以便在片段着色器中读取-

        var count=0;
        var table = [];
        for (var y = 0.1; y<1; y+=.01) {

            for (var x = 0.1; x<1; x+=.01) {

                var u = x;
                var u2 = y;
                u += u2 * 0.003921568627451;
                u *= 4.0;
                var sig = 1/(Math.exp(2.0 *(u-3)) + 1);

                table.push(Math.floor(sig*255));
                //table.push(255);
                table.push(0);
                table.push(0);
                table.push(0);
                count+=4;


                console.log(Math.floor(sig*255)+"");
                console.log(0+"");
                console.log(0+"");
                console.log(0+"");


            }

        }

        //alert(count);
          //alert(table[101]);

        texturetab = gl.createTexture();

        gl.bindTexture(gl.TEXTURE_2D, texturetab);

        gl.pixelStorei(gl.UNPACK_ALIGNMENT, 1);

        gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 100, 100, 0,

                      gl.RGBA, gl.UNSIGNED_BYTE, new Uint8Array(table));

        //

        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);

        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);

        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);

        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);



        gl.uniform1i(gl.getUniformLocation(prog, "uTabSamp"), 2);

但是当我在着色器上“捕捉”纹理的值时,计算就好像它只是读取 0 的值一样——它并没有像它应该的那样改变—— (片段着色器中捕获值的片段):

        sigmoid =  (texture2D(uTabSamp, vec2(floor(u*100.+.5), floor(u2*100.+.5))).r)/255.;

        float hfunc   = sigmoid * u * u;
        float ffunc   = -u +(a - pow(v*nb,m))*hfunc ;

鉴于 WebGL 难以阅读,我该如何解决这个问题?

【问题讨论】:

    标签: arrays textures webgl fragment-shader computation


    【解决方案1】:

    texture2D(uTabSamp, vec2(floor(u*100.+.5), floor(u2*100.+.5))

    纹理样本坐标的范围必须在 0.0 到 1.0 之间。因此,根据您构建的纹理大小缩放您的查找。

    未显示您的纹理制作代码,但请务必将插值设置为 NEAREST(假设您希望准确访问这些值),并从每个像素的“中间”进行采样。例如,128 x 32 纹理的左下角像素将位于vec2(0.5 / 128.0, 0.5 / 32.0)

    【讨论】:

    • gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST); gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST); gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE); gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);像这样?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-08-25
    • 1970-01-01
    • 1970-01-01
    • 2014-11-26
    相关资源
    最近更新 更多