跳到主要内容
← Math

Math

Oriented Line

点乘的应用2

实时渲染 · 2D 片段 GLSL

第 11 课:Oriented Line

我的解:点乘的应用2

我的解

uniform float iTime;
uniform vec2 iResolution;

void main() {
  vec2 uv = gl_FragCoord.xy / iResolution.xy;
  uv *= 2.0;
  uv -= 1.0;
  uv.x *= iResolution.x / iResolution.y;

  float line = 0.0; // FIX IT

  vec2 a = vec2(0.5, 0.5);
  vec2 b = a + vec2(cos(iTime), sin(iTime));
  vec2 lineAP = uv-a;
  vec2 norm_lineAB = normalize(b-a);
  float signedDistance = dot(lineAP,norm_lineAB);
  vec2 proj_b_A = signedDistance * norm_lineAB;

  vec2 perp_AB = lineAP-proj_b_A;
  line += step(length(perp_AB),0.2);

  vec3 result = mix(vec3(0.12), vec3(1.0, 0.3, 0.3), line);

  gl_FragColor = vec4(result, 1.0);
}

复盘笔记

  • 点乘的应用2