WebGL 片段着色器中奇怪的浮点运算

Question

我正在编写一个简单的 WebGL 程序。我在着色器程序中遇到了奇怪的行为：

条件 ( 1.01 * 2.0 > 1.0 ) 计算结果为 true 但 条件 ( 0.99 * 2.0 > 1.0 ) 计算结果为 flase

每次我将小于 1.0 的数字乘以其他值时，都会得到小于 1.0 的数字代码>

为什么会这样呢？

[编辑]

我正在使用片段着色器使用窗口级别和窗口高度（线性渐变）将 16 位无符号整数数据更改为 8 位位图并显示在屏幕上。 由于在 WebGL 中没有直接的方法将 16 位数据存储为内部格式（据我所知），我决定创建 Uint8Array(width*height*3)，将第一个字节存储在 R 通道中，第二个字节存储在 B 通道中并将其放入 gl.RGB、gl.UNSIGNED_BYTE 纹理中（也许 LUMINESCANCE_ALPHA 会更好）。

在着色器中，我重建字形式字节并进行调平。 着色器程序：

#ifdef GL_ES
precision highp float;
#endif

uniform highp sampler2D   s_texture;
uniform highp float       u_ww;
uniform highp float       u_wc;
varying highp vec2        v_texcoord;

void main(void)
{
     highp vec3 color = texture2D(s_texture, v_texcoord).rgb;
 highp float S = 255.;
 highp float d = 65280.;
 highp float m = 0.9;
 highp float c = color.g*d + color.r*S;

 float dp = 0.;

 float min = u_wc - u_ww/2.;
 float max = u_wc + u_ww/2.;

 if( 1.0*2.0 > 1.1 ) gl_FragData[0] = vec4(1,0,0,1);
 else{
    if( c<min ) c=0.;
    else if( c>max ) c=255.;
    else c=(255.*(max-c))/u_ww; 

    c = c/S;
    gl_FragData[0] = vec4(c,c,c,1);
 }
}

如您所见，有一行愚蠢的代码 if( 1.0*2.0 > 1.1 ) gl_FragData[0] = vec4(1,0,0,1); 这是我测试浮点运算的地方。在此示例中，整个图像为红色，但当条件为 0.999999999*2.0 > 时，整个图像为红色。 1.1 答案是错误的。当我在重新采样的 16 位图像中发现奇怪的伪像时，我开始怀疑一些事情。

我在 Chrome 8 和 Firefox 4 上测试了它。我相信我不了解浮点运算。

Answer 1

也许它没有使用浮动。

试试这个：

float xa = 1.01; //then change to 0.99
float xb = 1.0;
float xc = 2.0;
if (xa * xb > xc)
    ...

这有帮助吗？如果是这样，也许编译器（或硬件）出于某种原因将它们转换为 int 。

Answer 2

您应该将着色器精简到尽可能小的情况。

if( 1.0*2.0 > 1.1 ) gl_FragData[0] = vec4(1,0,0,1);
else gl_FragData[0] = vec4(1,0,1,1);

以及

if( 0.999999*2.0 > 1.1 ) gl_FragData[0] = vec4(1,0,0,1);
else gl_FragData[0] = vec4(1,0,1,1);

需要添加多少个 9 才能触发该错误？只用0.9还会出现这种情况吗？

完成此操作后，使用该代码报告 Chrome 或 Firefox 的错误（它们使用相同的 GLSL 解析器）。解析具有太多有效数字的常量时完全有可能存在错误。