[英]How to use 1D texture with no filtering on the shader with texelFetch
I want to pass a bunch of floats to the fragment shader, and access them by index. 我想将一堆浮点数传递给片段着色器,并按索引访问它们。
Basically 1D Textures method mentioned in this answer: Passing a list of values to fragment shader 基本上在此答案中提到的1D Textures方法: 将值列表传递给片段着色器
I try this: 我尝试这样:
javascript code
gl.pixelStorei(gl.UNPACK_ALIGNMENT, 1);
const data = new Uint8Array([
255, 64, 192,
0, 192, 0
]);
let texture = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, texture);
gl.texImage2D(gl.TEXTURE_2D,
0,
gl.R8,
3,
2,
0,
gl.RED,
gl.UNSIGNED_BYTE,
data);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
gl.activeTexture(gl.TEXTURE0);
gl.bindTexture(gl.TEXTURE_2D, texture);
I access this uniform in frag shader: 我在碎片着色器中访问此制服:
uniform sampler2D u_texture;
void main() {
vec2 trans = texelFetch(u_texture, ivec2(0, 0), 0);
}
I use glTexImage2D
because I saw an example of that, This partially works, but has two problems: 我使用
glTexImage2D
是因为我看到了一个例子,这部分起作用,但是有两个问题:
I want to get rid of all the filtering options gl.texParameteri
because I don't need them. 我想摆脱所有过滤选项
gl.texParameteri
因为我不需要它们。 But if I delete those I don't get the data. 但是,如果我删除那些,我不会得到数据。
This texelFetch
method returns values in the range [1, 0] (eg: 1 for 255). 此
texelFetch
方法返回[1,0]范围内的值(例如:1表示255)。 Why does that happen? 为什么会这样呢?
Basically I need an example of the mentioned method. 基本上我需要一个提到的方法的例子。
I want to get rid of all the filtering options gl.texParameteri because I don't need them.
我想摆脱所有过滤选项gl.texParameteri,因为我不需要它们。 But if I delete those I don't get the data.
但是,如果我删除那些,我不会得到数据。
The texture parameters are stored in the texture object. 纹理参数存储在纹理对象中。 The initial value of the parameter
TEXTURE_MIN_FILTER
is NEAREST_MIPMAP_LINEAR
, for TEXTURE_MAG_FILTER
it is LINEAR
and for TEXTURE_WRAP_S
respectively TEXTURE_WRAP_T
it is REPEAT
. 参数的初始值
TEXTURE_MIN_FILTER
是NEAREST_MIPMAP_LINEAR
,对于TEXTURE_MAG_FILTER
它是LINEAR
和TEXTURE_WRAP_S
分别TEXTURE_WRAP_T
它是REPEAT
。
If you want different values for parameters, then you've to set them explicitly (for each texture object). 如果需要不同的参数值,则必须为每个纹理对象显式设置它们。 There is no way around.
没有办法。
In your case the issue is the initial value of the parameter TEXTURE_MIN_FILTER
(as mentioned above it is NEAREST_MIPMAP_LINEAR
). 在你的情况下,问题是参数的初始值
TEXTURE_MIN_FILTER
(如上面提到它是NEAREST_MIPMAP_LINEAR
)。
If the minification filter requires a mipmap (not NEAREST
and not LINEAR
), but the texture doesn't have mipmaps, then the texture is not "mipmap complete". 如果缩小过滤器需要mipmap(不是
NEAREST
和LINEAR
),但是纹理没有mipmap,则纹理不是“ mipmap complete”。
Note, the result of of a texel fetch is (0, 0, 0, 1), if a texture is not complete. 请注意,如果纹理不完整,则纹理提取的结果为(0,0,0,1)。 See WebGL 2.0 - 5.12 Texel Fetches .
请参阅WebGL 2.0-5.12 Texel提取 。
This texelFetch method returns values in the range [1, 0] (eg: 1 for 255).
此texelFetch方法返回[1,0]范围内的值(例如:1表示255)。 Why does that happen?
为什么会这样呢?
This is cause by the pixel format which is used to specify the pixel data ( gl.texImage2D
). 这是由于用于指定像素数据的像素格式(
gl.texImage2D
)引起的。
The format, type combination gl.RED
, gl.UNSIGNED_BYTE
specifies a Normalized Integer format. 格式类型组合
gl.RED
, gl.UNSIGNED_BYTE
指定规范化整数格式。 The full range of the integral data type is mapped to the floating point range [0, 1] for unsigned normalized integers (such as UNSIGNED_BYTE
, UNSIGNED_SHORT
, UNSIGNED_INT
) and to the range [-1, 1] for signed normalize integers (such as BYTE
, SHORT
, INT
). 整数数据类型的完整范围被映射到无符号归一化整数(例如
UNSIGNED_BYTE
, UNSIGNED_SHORT
, UNSIGNED_INT
)的浮点范围[0,1],并被映射到有符号归一化整数的范围[-1,1](例如BYTE
, SHORT
, INT
)。
In WebGL 2.0 (respectively OpenGL ES 3.0 ) there is the possibility to specify the image format by the combination gl.RED_INTEGER
, gl.UNSIGNED_BYTE
, which specifies an integral pixel format and corresponds to the internal image format R8UI
(see WebGl 2.0 - 3.7.6 Texture objects ): 在WebGL 2.0 (分别为OpenGL ES 3.0 )中,可以通过
gl.RED_INTEGER
, gl.UNSIGNED_BYTE
组合指定图像格式,该组合指定整数像素格式并对应于内部图像格式R8UI
(请参阅WebGl 2.0-3.7。 6个纹理对象 ):
gl.texImage2D(gl.TEXTURE_2D,
0,
gl.R8UI,
3,
2,
0,
gl.RED_INTEGER,
gl.UNSIGNED_BYTE,
data);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.