使用着色器中的索引引用数据纹理中的纹素答案

【问题标题】：Referencing texels in a data texture using indexes in the shader使用着色器中的索引引用数据纹理中的纹素
【发布时间】：2017-06-21 06:29:58
【问题描述】：

我尝试使用着色器中的索引来访问 DataTexture 的纹素中的值。索引[0, 1, 2, 3, 4, 5, 6... 62, 63] 是连续的，而数据纹理的高度和宽度（uTextureDimension）为 8。经过一番研究，我编写了这个函数来获取特定的索引值，并引用相应的纹素：

vec2 customUV = vec2( mod(aIndex, uTextureDimension) / uTextureDimension, floor(aIndex / uTextureDimension) / uTextureDimension );
vec4 texelValues = texture2D( tDataTexture, customUV ).xyzw;

我也试过这个版本来从它的中心点引用纹素。也没有骰子：

vec2 perMotifUV = vec2( mod( aIndex, uTextureDimension ) * (( 1.0 / uTextureDimension )/2.0), floor( aIndex / uTextureDimension ) * (( 1.0 / uTextureDimension )/2.0) );
vec4 texelValues = texture2D( tDataTexture, customUV ).xyzw;

从昨天下午开始处理这个问题，到处编辑它，并四处寻找其他解决方案，我仍然没有得到预期的结果。我应该说，在使用 Three.js 时，着色器被设置为高精度浮点数——这是问题的一部分吗？任何人都可以在这里推动我走上正轨吗？谢谢！

【问题讨论】：

标签： three.js glsl textures shader

【解决方案1】：

如果一切都是浮动的，第一个似乎是正确的。您是否使用 NEAREST 过滤器模式？从技术上讲，您还应该添加一个半纹素大小的偏移量：

vec2 texelSize = 1.0 / uTextureDimension;
vec2 customUV = vec2( mod(aIndex, uTextureDimension)*texelSize, floor(aIndex / uTextureDimension)*texelSize );
customUV += vec2(0.5*texelSize);

编辑 - 你的指数也应该是 0-63 而不是 0-64

【讨论】：

作为后续，这种方法是否适用于高度和宽度不同的 DataTextures。我假设你有两个纹理尺寸和两个相应的纹素尺寸。