跳到主要内容
← Math

Math

Dot Scalar Projection

点乘的应用1

实时渲染 · 2D 片段 GLSL

第 9 课:Dot Scalar Projection

我的解:点乘的应用1

我的解

uniform float iTime;
uniform vec2 iResolution;

float circle(vec2 c, vec2 uv, float r) {
  return 1.0 - smoothstep(r, r + 0.01, distance(c, uv));
}

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

  vec2 a = vec2(-1.0);
  vec2 b = vec2(1.0, -0.25);
  vec2 p = vec2(cos(iTime) - 0.3, sin(iTime) * 0.4 + 0.3);
  vec2 lineAB = b-a;
  vec2 lineAP = p-a;
  float dot_APDotAB = dot(lineAP,lineAB);
  float proj_ap2ab = dot_APDotAB / length(lineAB);

  vec2 projected =  a + proj_ap2ab * normalize(lineAB);

  float circles = circle(p, uv, 0.2) + circle(projected, uv, 0.2) * 0.9;
  gl_FragColor = mix(vec4(0.0), vec4(1.0, 0.3, 0.3, 1.0), circles);
}

复盘笔记

  • 点乘的应用1