第 7 课：Gradient Noise

实现：![[Pasted image 20251214221952.png]]

实现

uniform vec2 iResolution;

vec2 random2(vec2 point){
  float d1 = dot(point, vec2(12.3, 32.1));
  float d2 = dot(point, vec2(45.6, 65.4));

  point = vec2(d1, d2);
  return fract(sin(point) * 78.9) * 2.0 - 1.0;
}

float noise(vec2 point) {
  vec2 i = floor(point);
  vec2 f = fract(point);

  vec2 u = smoothstep(0.0, 1.0, f);

  vec2 d1 = f - vec2(0.0, 0.0);
  vec2 d2 = f - vec2(1.0, 0.0);
  vec2 d3 = f - vec2(0.0, 1.0);
  vec2 d4 = f - vec2(1.0, 1.0);

  vec2 r1 = random2(i + vec2(0.0, 0.0));
  vec2 r2 = random2(i + vec2(1.0, 0.0));
  vec2 r3 = random2(i + vec2(0.0, 1.0));
  vec2 r4 = random2(i + vec2(1.0, 1.0));

  float dot1 = dot(d1,r1);
  float dot2 = dot(d2,r2);
  float dot3 = dot(d3,r3);
  float dot4 = dot(d4,r4);

  return mix(mix(dot1,dot2,u.x),mix(dot3,dot4,u.x),u.y);
}

void main() {
  vec2 uv = gl_FragCoord.xy / iResolution.xy;
  vec2 ratio = vec2(iResolution.x / iResolution.y, 1.0);

  float noiseValue = noise(vec2(uv * ratio * 5.0)) * 0.5 + 0.5;

  gl_FragColor = vec4(vec3(noiseValue), 1.0);
}

复盘笔记

• ![[Pasted image 20251214221952.png]]