Fragment Shader for sampling 3 components gradient vs one RGB

Question

I want to sample gradient with three components separated as opposed to one combined gradient

I tried :

 out.x = texture2D(inputTexture, vec2(color.x, 0)).x ;
 out.y = texture2D(inputTexture, vec2(color.y, 1)).y ;
 out.z = texture2D(inputTexture, vec2(color.z, 2)).z ;

But it outputs messed up colours with a lot of noise.

This the three component gradient with 3 pixel height :

These are the images after I applied

out.x = texture2D(inputTexture, vec2(color.x, 0.0)).x ;
out.y = texture2D(inputTexture, vec2(color.y, 0.5)).y ;
out.z = texture2D(inputTexture, vec2(color.z, 0.9)).z ;

=>

Answer 1

Texture coordinates are stored in the range of 0-1, NOT in texel space, so when you are asking for a pixel with a y coord of 2, you are asking for something off the texture, and the result you get back will be dependant on whether nor not you are clamping or wrapping the texture.

Try asking for the y coords of 0.0, 0.5 and 0.9

A better solution might be to use a texture with a single gradient, and sample the channels from that individually. The following texture and code will give the same result:

out.x = texture2D(inputTexture, vec2(color.x, 0)).x ;
out.y = texture2D(inputTexture, vec2(color.y, 0)).y ;
out.z = texture2D(inputTexture, vec2(color.z, 0)).z ;