屏蔽gl_PointSize生成的片段

时间:2017-03-15 14:41:06

标签: opengl-es three.js shader

我正在试图掩盖一些用点制作的粒子,这样它们就不会在场景的某些区域渲染,但我似乎无法将片段着色器设置为正确,这就是我所拥有的远:

uniform sampler2D tDiffuse;
uniform sampler2D tStencil;

varying vec2 vTexCoord;

void main() {
    vec4 diffuseColor = texture2D( tDiffuse, vTexCoord );
    vec4 stencil = texture2D(tStencil, gl_FragCoord.xy);
    gl_FragColor = stencil * diffuseColor;
}

顶点着色器:

attribute float size;
varying vec2 vTexCoord;

void main() {
    vec3 vertex = position;
    vTexCoord = vTexCoordRef;
    gl_PointSize = size;
    vec4 mvPosition = modelViewMatrix * vec4( vertex, 1.0 );
    gl_Position = projectionMatrix * mvPosition;
}

着色器输出:

Shader output

模具纹理:

Stencil texture

油漆所需的输出:

enter image description here

1 个答案:

答案 0 :(得分:1)

我相信你缺少的部分是tStencil的纹理坐标。如果该纹理与tDiffuse的大小相同,那么您可以对两者使用相同的vTexCoord

uniform sampler2D tDiffuse;
uniform sampler2D tStencil;

varying vec2 vTexCoord;
varying vec2 vTexCoord2; // a texture coord for the stencil

void main() {
   vec4 diffuseColor = texture2D( tDiffuse, vTexCoord );
   vec4 stencil = texture2D(tStencil, vTexCoord2);
   gl_FragColor = stencil * diffuseColor;
}

如果一切顺利,您可能需要查看您的alpha值。如果您的点云由图像中间的白点和周围的黑色清晰颜色组成,那么您希望您的模板渲染为Alpha通道。做一个条件,这样无论你的模板图像纹素出现在哪里(无论它们是什么颜色或alpha),都要将gl_FragColor的alpha设置为0.0。这应该穿过点云的白色,露出黑色的清晰色彩。

gl_FragColor = vec4( (gl_FragColor * diffuseColor).rgb, alphaBasedOnStencil );