世界位置到片段着色器 glsl 中的屏幕位置

Question

我有一个 WebGL 渲染器，我想在片段着色器中将随机世界坐标转换为屏幕坐标。

这样我就可以将 "computed screen coordinates" 与当前片段屏幕坐标进行比较。

我相信我拥有这样做所需的所有信息，只是不确定哪种方法是正确的。

  ...
  // available information:

  // uCanvasWidth (float)
  // uCanvasHeight (float)
  // modelMatrix (mat4)
  // modelViewMatrix (mat4)
  // projectionMatrix (mat4)
  vec4 someWorldCoordinates = vec4(1., 2., 3., 1.);
  // map it to screen coordinates?
  vec4 screenCoordinates = ???

  // compare to current fragment location
  if(screenCoordinates.x > gl_FragCoord.x){
    // do stuff
  }
  ...

Answer 1

vec4 worldSpace = vec4(1., 2., 3., 1.);
// get homogeneous clip space coordinates
vec4 clipSpace = projectionMatrix * ( modelViewMatrix * worldCoords );
// apply perspective divide to get normalized device coordinates
vec3 ndc = clipSpace.xyz / clipSpace.w;
// do viewport transform
vec2 screenSpace = (ndc.xy * .5 + .5) * vec2(uCanvasWidth, uCanvasHeight);
screenSpace.y = uCanvasHeight - screenSpace.y;

请注意，您的 modelView 矩阵可能包含您正在渲染的模型的变换。我假设在着色器中指定的点被认为已经是“final”世界space（因为与你正在渲染的模型无关），所以你可能只想在这里使用 view 矩阵（最好是预乘 viewProjection）。

世界位置到片段着色器 glsl 中的屏幕位置

world position to screen position in fragment shader glsl

glsl

webgl

fragment-shader

coordinate-transformation