将浮点数据编码为RGBA纹理

我编写了一些基于浮点纹理的WebGL代码。但是，在多个设备上测试时，我发现对OES_texture_float扩展的支持并不像我想象的那样广泛。所以我正在寻找回退。将浮点数据编码为RGBA纹理

我目前有一个亮度浮点纹理值介于-1.0和1.0之间。我想用没有任何扩展名的WebGL中可用的纹理格式编码这些数据，所以可能是一个简单的RGBA无符号字节纹理。

我有点担心潜在的性能开销，因为需要这种回退的情况是旧的智能手机或平板电脑已经比现代台式电脑有更弱的GPU。

如何在不支持WebGL的设备上模拟浮点纹理？

2016-01-23 John Doe

[你如何收拾一个32位INT为4个，在GLSL/WebGL的8位整数的可能的复制？ ]（http://stackoverflow.com/questions/18453302/how-do-you-pack-one-32bit-int-into-4-8bit-ints-in-glsl-webgl） –

这应该是一个很好的起点：http://aras-p.info/blog/2009/07/30/encoding-floats-to-rgba-the-final/

它适用于编码0.0到1.0，但应该很容易重新映射到你的要求的范围内。

来源

2016-01-23 13:05:04 Columbo

如果您知道您的范围是-1到+1，最简单的方法就是将其转换为某个整数范围，然后再转换回来。 Using the code from this answer这包是从0到1成32位色

const vec4 bitSh = vec4(256. * 256. * 256., 256. * 256., 256., 1.); 
const vec4 bitMsk = vec4(0.,vec3(1./256.0)); 
const vec4 bitShifts = vec4(1.)/bitSh; 

vec4 pack (float value) { 
    vec4 comp = fract(value * bitSh); 
    comp -= comp.xxyz * bitMsk; 
    return comp; 
} 

float unpack (vec4 color) { 
    return dot(color , bitShifts); 
}

值然后

const float rangeMin = -1.; 
const float rangeMax = -1.; 

vec4 convertFromRangeToColor(float value) { 
    float zeroToOne = (value - rangeMin)/(rangeMax - rangeMin); 
    return pack(value); 
} 

float convertFromColorToRange(vec4 color) { 
    float zeroToOne = unpack(color); 
    return rangeMin + zeroToOne * (rangeMax - rangeMin); 
}

来源

2016-01-25 08:16:06 gman

将浮点数据编码为RGBA纹理

回答

相关问题