Shaders Bottom Up Texture Atlas

Hey guys… Does anybody out there know how to deal with a Bottom-Up texture.

I am trying to write my own Terrain Splatmap Shader… @nasimiasl is also working on (i think, i haven’t heard back from him in a bit). So i started working on my own splatmap shader code.

First i created a texture atlas for the splatmap:

Now the rectangle for the first splat is 0.0, 0.0, 0.5, 0.5

But the first splat (0,0) is in the BOTTOM-LEFT and not TOP-LEFT.

How do i transpose my uv texcoords to deal with bottom up images…

This is my little TextureAtlas code for fracting with scale/tile/wrapping and offset:


vec4 textureAtlas2D(sampler2D atlas, vec4 rect, vec2 scale, vec2 uv, vec2 offset, float lod) {
	vec2 fractUV = fract(uv * scale);
	vec2 atlasUV = vec2((fractUV.x * rect.w) + rect.x, (fractUV.y * rect.z) + rect.y);
	vec2 tiledUV = atlasUV + offset;
	return texture2DLodEXT(atlas, tiledUV, lod);
}


and when i wand the first splatmap frm the splatmap texture atlas (rect: 0, 0, 0.5, 0.5)

#ifdef SPLATMAPTEXTURES
    float lod = 0.0; // TODO: Compute Mip Map Level
	vec4 splatmapColor = textureAtlas2D(splatmapTextures, vec4(0.0, 0.0, 0.5, 0.5), vec2(1.0, 1.0), vUV, uvOffset, lod);
    surfaceAlbedo = splatmapColor.rgb;
#endif


The problem is the shader is expecting TOP-DOWN… so my rect X and Y are off

i would need to use a rect: 0.0, 0.5, 0.5, 0.5

Sooo… How can i OFFSET or deal with the BOTTOM-UP texture atlas… Where i use the RECT of the texture in atlas to do all the fracting, scale and offset… the textureAtlas2D function from above…

Any help would be going towards the Unity Babylon Toolkit (Exporter) .

:slight_smile:

Im thinking i can just go uv.y = 1.0 - tileSize… But i dont know if thats the correct way to deal with BOTTOM-UP texture Atlas… What do you think… Anybody

This is what i am doing so far:


#ifdef SPLATMAPTEXTURES
    float lod = 0.0;            // TODO: Compute Mip Map Level
    float tile = 0.5;           // TODO: Compute Tile Size For LOD
    float tilex = 0.0;          // TODO: Use Tile-X From Atlas Rect
    float tiley = 1.0 - tile;   // Compute Bottom-Up Tile-Y From Tile
	vec4 splatmapColor = textureAtlas2D(splatmapTextures, vec4(tilex, tiley, tile, tile), vec2(1.0, 1.0), vUV, uvOffset, lod);
    surfaceAlbedo = splatmapColor.rgb;
#endif

How are you creating the texture?

https://doc.babylonjs.com/api/classes/babylon.texture
new Texture(url: Nullable, scene: Nullable<Scene>, noMipmap?: boolean, invertY?: boolean, samplingMode?: number, onLoad?: Nullable, onError?: Nullable, buffer?: Nullable<string | ArrayBuffer | HTMLImageElement | Blob>, deleteBuffer?: boolean, format?: number): Texture

Sounds like you might be doing something like this:
var atlas = new BABYLON.Texture(image, scene, false, true);
The fourth parameter specifies whether you want to invert the texture along the y axis.

1 Like

The texture SPLAT itself has right Y Axis. I am talking about using a BOTTOM-UP texture atlas and fracting a TILE with its RECT within the Texture Atlas.

The the follow atlas:

The actual FIRST tile is the one with MOSTLY red. Its RECT: x=0 , y=0 width = 0.5, height = 0.5

BUT the Texture Atlas is bottom up… So 0,0 is NOT the TOP-LEFT

so the 0,0,0.5,0.5 is giving me back the all black tile with just a bit of red pattern, when it should be the MOSTLY red tile with detailed BLUE and BLACK patterns in BOTTOM-LEFT.

How would i convert the RECTS to work ???

Shit … Sorry everyone… This was all my bad in the first place…

First of GLTF is Supposed to Flip the Y TexCoord in the GLTF EXPORT

And the BOTTOM-UP texture atlas appeartly is the default way textures are sample in OpenGL…

So my rects for where the texture is in the atlas is just fine…

my freaking atlasUV calculations had the Z for width and W for height transposed…

This is a peice of shader code i ported from my very first texture atlas attempt and i did like to put WIDTH as Z and HEIGHT as W… So i flipped it to put WIDTH in W (because it started with W)

the fix was pretty easy:

``
vec2 atlasUV = vec2((fractUV.x * rect.z) + rect.x, (fractUV.y * rect.w) + rect.y);

``

NOTE: X and Z are for WIDTHS and Y AND W are for heights… as far as the rect values

… So now my Texture Atlas Support Using Fract with Scale,Offset and LOD is pretty clean and only a few lines of code… Using Texture Rect (will be encoded into a Lookup texture) for the texture within the Atlas and FRACTING with SCALE and OFFSET At Whatever the desired Mip map level is this:

Update… still have edge seams if using any other mip map than 0

It looks like it’s up to @nasimiasl to actually get this texture atlas stuff going

Or I go back to separate textures and only support 3 to 6 splats again :worried:

hey @MackeyK24
i had a busy week i back on project in Monday

Thanks @nasimiasl … When you get back into it… I created more detailed texture export… Using Unity Built-In Texture mip map generation and texture packing… We can really really encode the whole mip chain for 12 splats… they fit perfectly in texture atlas with whole mip chain…

Check out other post to download the 4K and 2K sample images:

Thanks again bro :slight_smile:

1 Like