ThreeJS Shader Dynamic Texture

Question

I have this shader code below. I want to add a new uniform for another texture and make it that it would be applied to the vertices that is divisible by 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 );
}

I want to add a condition something like index % 4 === 0 ? firstTexture : secondTexture but I do not know how to get the vertex index and perform a modulo operator in the shader language.

Paul-Jan · Accepted Answer · 2018-10-10 14:20:20Z

3

WebGL GLSL does not provide a vertex index, so you'll have to provide that data manually. For more information, see this question.

The modulus operator in GLSL is a function called mod().

answered Oct 10, 2018 at 14:20

Paul-Jan

17.4k1 gold badge68 silver badges98 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

ThreeJS Shader Dynamic Texture

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related