0

我正在尝试将此处找到的高度图着色器示例重新调整为可以使用 32 位而不是 8 位精度的示例。正在进行中的代码位于 github 上:https ://github.com/bgourlie/three_heightmap

高度图是在 .NET 中生成的。高度在 0f...200f 范围内,并使用以下方法转换为 32 位颜色值(Unity 的Color 结构):

private static Color DepthToColor(float height)
{
    var depthBytes = BitConverter.GetBytes(height);
    int enc = BitConverter.ToInt32(depthBytes, 0);
    return new Color((enc >> 24 & 255)/255f, (enc >> 16 & 255)/255f, (enc >> 8 & 255)/255f,
            (enc & 255)/255f);
}

颜色数据被编码为 png,结果如下所示:

在此处输入图像描述

顶点着色器正在获取此图像数据并将 RBGA 值转换回原始高度值(使用我在此处回答的问题的技术):

uniform sampler2D bumpTexture; // defined in heightmap.js
varying float vAmount;
varying vec2 vUV;

void main()
{
  vUV = uv;
  vec4 bumpData = texture2D( bumpTexture, uv );
  vAmount = dot(bumpData, vec4(1.0, 255.0, 65025.0, 16581375.0));
  // Uncomment to see a "flatter" version
  //vAmount = dot(bumpData, vec4(1.0, 1.0/255.0, 1.0/65025.0, 1.0/160581375.0));

  // move the position along the normal
  vec3 newPosition = position + normal * vAmount;
  gl_Position = projectionMatrix * modelViewMatrix * vec4( newPosition, 1.0 );
}

结果肯定是一团糟:

在此处输入图像描述

我可以通过更改此行使其更平坦:

vAmount = dot(bumpData, vec4(1.0, 1.0/255.0, 1.0/65025.0, 1.0/16581375.0));

这会给我一个更平坦的图像,它至少显示了生成的地形的一个很好的轮廓,但是几乎完全是一个平面(有轻微的,虽然不明显的变化):

在此处输入图像描述

我认为我做错了一些事情,我只是不知道是什么。我不确定我是否正确编码了原始浮点数。我不确定我是否在顶点着色器中正确解码(我得到的值肯定在 0...200 的范围之外)。一般来说,我在 3d 图形方面也不是很有经验。因此,任何关于我做错了什么的指针,或者通常如何实现这一点都将不胜感激。

同样,可以在此处找到自包含的正在进行中的代码:https ://github.com/bgourlie/three_heightmap

4

2 回答 2

1

如果将宽整数编码到 RGBA 向量的分量中,则必须关闭过滤,以免值之间发生插值。此外,OpenGL 可能会在内部转换为不同的格式,但这只会减少您的样本深度。

于 2015-02-22T20:59:17.847 回答
1

你的颜色:

return new Color((enc >> 24 & 255)/255f, (enc >> 16 & 255)/255f, (enc >> 8 & 255)/255f,
        (enc & 255)/255f);

... 包含 in 的最高有效字节,encinr的第二高字节g等。

这个:

vAmount = dot(bumpData, vec4(1.0, 255.0, 65025.0, 160581375.0));

vAmountr最低有效字节、次低有效字节等构建g(尽管被乘数应为 256、65536 等*)。所以字节的顺序不正确。更扁平的版本:

vAmount = dot(bumpData, vec4(1.0, 1.0/255.0, 1.0/65025.0, 1.0/160581375.0));

以正确的顺序获取字节,但将输出值缩放到 range [0.0, 1.0],这可能就是它看起来基本平坦的原因。

因此,切换编码或解码字节的顺序并选择适当的比例。

(*) 这样想:可以在任何频道上播放的最小数字是1.0 / 255.0. 最不重要的通道将在范围内[0, 1.0]- 从0 / 255.0255.0 / 255.0。您想要缩放下一个通道,以便它的最小值是该比例的下一个值。所以它的最小值应该是256 / 255.0。所以你需要1.0 / 255.0变成256.0 / 255.0. 您可以通过乘以 而256不是乘以 来实现255

于 2015-02-23T01:58:06.537 回答