ThreeJS着色器动态纹理

时间:2018-10-10 14:08:33

标签: three.js glsl shader

我在下面有此着色器代码。我想为另一种纹理添加新的均匀性,并使其适用于可被4整除的顶点。

uniform vec3 color;
uniform sampler2D texture;

varying vec4 vColor;

void main() {

    vec4 outColor = texture2D( texture, gl_PointCoord );

    if ( outColor.a < 0.5 ) discard;

    gl_FragColor = outColor * vec4( color * vColor.xyz, 0.5 );

    float depth = gl_FragCoord.z / gl_FragCoord.w;
    const vec3 fogColor = vec3( 0.0 );

    float fogFactor = smoothstep( 200.0, 600.0, depth );
    gl_FragColor = mix( gl_FragColor, vec4( fogColor, gl_FragColor.w ), fogFactor );
}

我想添加诸如index % 4 === 0 ? firstTexture : secondTexture之类的条件,但是我不知道如何获取着色器语言的顶点索引并执行模运算符。

1 个答案:

答案 0 :(得分:3)

WebGL GLSL不提供顶点索引,因此您必须手动提供该数据。有关更多信息,请参见this question

GLSL中的模运算符是一个名为mod()的函数。