[GLSL] Float-float Noise

 

https://thebookofshaders.com/11/

The Book of Shaders

---

source:  https://www.autohotkey.com/boards/viewtopic.php?t=31122

The left side is a noise graph, and the right side is a random graph. A noise and a random are different.

 

Let's make a noise function.

float i = floor(x);  // integer
float f = fract(x);  // fraction
y = rand(i);

float i = floor(x);  // integer
float f = fract(x);  // fraction
y = mix(rand(i), rand(i + 1.0), f);

float i = floor(x);  // integer
float f = fract(x);  // fraction
y = mix(rand(i), rand(i + 1.0), smoothstep(0.,1.,f));

 

floor( ), fract( ), mix( ), smoothstep( ) : https://thebookofshaders.com/glossary/

 

#ifdef GL_ES
precision mediump float;
#endif

uniform vec2 u_resolution;

float random(float f){
    float y = fract(sin(f*2343.34)*2345.59);
    return y;
}

float noise(float val){
    float i = floor(val);
    float f = fract(val);
    
    return mix(random(i), random(i+1.), smoothstep(0., 1., f));
}

void main(){
	vec2 coord = gl_FragCoord.xy/u_resolution;
    coord.x *= u_resolution.x/u_resolution.y;
    coord.x *= 10.;
	
    vec3 col = vec3(noise(coord.x));

    gl_FragColor = vec4(col, 1.0); 
}