possible conflicts with shaders?

[ivang76]

Hi Felix, thanks a lot and compliments for this cool project!

I was playing a bit with the container and sub-blocks (like in your tutorial) in a 3d scene where I have just put an initial overlay with fading effect until everything is loaded. Something like this:

        const overlayGeometry = new THREE.PlaneGeometry(2, 2, 1, 1)
        const overlayMaterial = new THREE.ShaderMaterial({
            transparent: true,
            vertexShader: "
                void main()
                {
                    gl_Position = vec4(position, 1.0);
                }
            ",
            fragmentShader: "
            uniform float uAlpha;

            void main()
            {
                gl_FragColor = vec4(0.0, 0.0, 0.0, uAlpha);
            }
            ",
            uniforms:
            {
                uAlpha: { value: 1 }
            },  
        })
        this.overlay = new THREE.Mesh(overlayGeometry, overlayMaterial);
        this.engine.scene.add(this.overlay);

And I noticed that the blocks into the containers are not rendered/shown if I keep the shader material. In the scene there will be only the container and no text, no images...

Have you some idea on what could be the cause? thanks!

[antonyadhiban]

Hi @ivang76 , is this issue happening without shaders as well?

I'm having a similar issue after migrating from our old setup from three.js 125 to 135. The UI elements are not rendered but it can be seen in the mesh hierarchy with all the properties.

[swingingtom]

Hello thank you for pointing this out. Could you provide a sandbox to reproduce this?

[ivang76]

Hi @antonyadhiban, no without shaders the issue doesn't happen