Floating point 在glsl中将rgb值解码为单浮点数而不移位

我目前正忙于webgl中的延迟着色，我需要将3个整数值（在[0..256]=256^3范围内）解码为单个32位浮点，然后对其进行编码。因为这是针对WebGL的，所以必须在没有按位操作的情况下完成。精确对我来说并不重要（但我认为可以做到）

这就是我所拥有的，但我认为这是错误的，因为我存储编码值的纹理的精度

float packColor(vec3 color) {   return (color.r + (color.g*256.) + (color.b*256.*256.)) / (256.*256.*256.); }

vec3 decodeColor(float f) { 
float b = floor(f * 256.0);
float g = floor(f * 65536.0) - (b*256.);
float r = (floor(f * 16777216.0) - (b*65536.)) - (g*256.);
return vec3(r, g, b)/ 256.0;//vec3(r, g, b) / 256.0;  }

谢谢..

像这样吗

function pack(color)  { return color.r + color.g * 256 + color.b * 256 * 256; }

function unpack(f)  {
    var b = Math.floor(f / (256 * 256));
    var g = Math.floor((f - b * 256 * 256) / 256);
    var r = Math.floor(f % 256);
    return vec3(r, g, b);
}

---

我知道这是一个老问题，但我有同样的问题，我会发布解决方案，以防将来有人需要它

float packColor(vec3 color) {
    return color.r + color.g * 256.0 + color.b * 256.0 * 256.0;
}

vec3 unpackColor(float f) {
    vec3 color;
    color.b = floor(f / 256.0 / 256.0);
    color.g = floor((f - color.b * 256.0 * 256.0) / 256.0);
    color.r = floor(f - color.b * 256.0 * 256.0 - color.g * 256.0);
    // now we have a vec3 with the 3 components in range [0..255]. Let's normalize it!
    return color / 255.0;
}

只要packColor填充的float不在[0,1]范围内，而是在[0,16777215]范围内，就不会有任何精度问题。但是如果在[0,1]范围内对浮点进行规格化，则会出现精度问题

请注意，您也不能存储alpha（以这种方式），因为highp浮点的长度为24位，而不是通常使用的32位。

---

在顶点着色器中，可以毫无问题地使用此代码（默认精度为highp），但在片段着色器中，必须确保仅使用高精度

@Makers\u F:感谢您提供了解压颜色功能的GLSL代码，但蓝色和红色组件似乎是相反的

对我来说，以下代码就像一个符咒：

vec3 unpackColor(float f) 
{
    vec3 color;

    color.r = floor(f / 256.0 / 256.0);
    color.g = floor((f - color.r * 256.0 * 256.0) / 256.0);
    color.b = floor(f - color.r * 256.0 * 256.0 - color.g * 256.0);

    // now we have a vec3 with the 3 components in range [0..256]. Let's normalize it!
    return color / 256.0;
}

---

这看起来在算法上是可行的，但我认为提问者希望它出现在GLSL中。谢谢你对范围的评论，我遇到了这些精度问题！我认为您混淆了“encode”和“decode”这两个词的含义……请注意，这对OP的packColor代码不起作用——它假设您也以相反的方式打包了R和B。