html - WebGL：如何获取片段着色器中每个像素的位置？

Question

我知道我可以gl_Position用来获取每个顶点的位置，但是是否可以在片段着色器中获取每个像素的位置？

我想改变一些像素区域的 alpha 值。

Answer 1

vec2 gl_FragCoord

它将以像素为单位返回片段在屏幕上的位置。如果您通过 uniformvec2 screenResolution那么您可以使用这两个值来确定屏幕上的确切位置是像素，在哪个部分等等。

这是一个内置变量，因此您可以在片段着色器中随时使用它。

这是一个示例，只是为了演示：http: //goo.gl/AG7UO

如果你想要片段的世界坐标，那么你应该使用varying变量。

顶点着色器：

varying vec3 vPos;
attribute vec3 aVertexCoord;
uniform mat4 uMVMat;
uniform mat4 uProjMat;

void main() {
    vPos = uMVMat * aVertexPos;
    gl_Position = uProjMat * vPos;
}

片段着色器：

varying vec3 vPos;
void main() {
    // do something
}

希望这可以帮助。