Pixel filtering shader issue. (SkyMaterial with texture2D)

Questions
,
1

Hello everyone!

I’m kinda stuck with SkyMaterial shader modification.

I want to implement day/night cycle as a night background image use simple texture with .png as source.

Here is the part of the shader code (pic1)

    vec4 texture = texture2D(nightSky, uv);

    vec4 color = clamp(vec4(retColor.rgb, alpha), 0.0, 1.0);
    vec4 nightSkyColor;

    if (uv.y < 0.5) {
        nightSkyColor = clamp(texture, 0.0, 1.0);
    }


    float luminance = color.r * 0.2126 + color.g * 0.7152 + color.b * 0.0722;
    // float darkness = 1.0 - luminance;


    nightSkyColor *=  luminance;

    color += nightSkyColor;

image
image1302×1245 33.9 KB

And here is the invertsion:

    vec4 texture = texture2D(nightSky, uv);

    vec4 color = clamp(vec4(retColor.rgb, alpha), 0.0, 1.0);
    vec4 nightSkyColor;

    if (uv.y < 0.5) {
        nightSkyColor = clamp(texture, 0.0, 1.0);
    }


    float luminance = color.r * 0.2126 + color.g * 0.7152 + color.b * 0.0722;
    float darkness = 1.0 - luminance;


    nightSkyColor *= darkness;

    color += nightSkyColor;

image
image1038×1221 86.6 KB

The question is on the surface :smiley: what’s wrong? I wanna get nice transition between bright sky and starry sky.

Maybe color value (normalization???) issue?

PS:
Unfortunatelly I cant provide sandbox link cuz its local sandbox (from contribution Guide).
But here is the code im using to set the texture:

        const skyMat = new BABYLON.SkyMaterial('sky', scene);

        const nightTexture = new BABYLON.Texture('https://i.postimg.cc/z8gwvY9n/skysphere-transparent2.png?dl=1');
        nightTexture.coordinatesMode = BABYLON.Texture.SPHERICAL_MODE;
    
        nightTexture.hasAlpha = true;
        skyMat.setNightSkyTexture(nightTexture);
        skyMat.sideOrientation = 0;
        skyMat.inclination = .49;
        skyMat.alphaMode = 1;
        sphere.material = skyMat;

        // Move the sphere upward 1/2 its height
        sphere.position.y = 1;
        sphere.useVertexColors = sphere.hasVertexAlpha = false;
2

I ended up with smth more complicated but it looks like the right way.

    vec4 nightSkyColor = vec4(0.0);

    vec4 desaturated = generic_desaturate(color.rgb, 1.0);
    desaturated *= 35.0; // 35 for darkness blend coeff
    desaturated = pow(desaturated, vec4(0.1)); /// 0.1 for transition coeff
    vec4 saturated = clamp(desaturated, 0.0,1.0);
    saturated = 1.0 - saturated;
    nightSkyColor = texture;
    nightSkyColor*=saturated;
    color+=nightSkyColor;
2 Likes