Tilemap cell UV

A small utility to get the cell UV coordinates in a tilemap

Shader code
shader_type canvas_item;

// The size of each square cell normalized
// So if your cell is 8px by 8px the value should be 1.0 / 8.0
// if your cell is 16px by 16px the value should be 1.0 / 16.0
const float tile_size = 1.0 / 8.0;

vec2 get_cell_uv(vec2 uv, vec2 pixel_size) {
	vec2 ut = uv;
	ut.x = mod(1.0 - uv.x, pixel_size.x / tile_size) / pixel_size.x * tile_size;
	ut.y = mod(1.0 - uv.y, pixel_size.y / tile_size) / pixel_size.y * tile_size;
	
	return ut;
}

void fragment() {
	vec2 cell_uv = get_cell_uv(UV, TEXTURE_PIXEL_SIZE);
	COLOR = vec4(cell_uv.x, cell_uv.y, 0.0, 1.0);
}shader_type canvas_item;

// The size of each square cell normalized
// So if your cell is 8px by 8px the value should be 1.0 / 8.0
// if your cell is 16px by 16px the value should be 1.0 / 16.0
const float tile_size = 1.0 / 8.0;

vec2 get_cell_uv(vec2 uv, vec2 pixel_size) {
	vec2 ut = uv;
	ut.x = mod(1.0 - uv.x, pixel_size.x / tile_size) / pixel_size.x * tile_size;
	ut.y = mod(1.0 - uv.y, pixel_size.y / tile_size) / pixel_size.y * tile_size;
	
	return ut;
}

void fragment() {
	vec2 cell_uv = get_cell_uv(UV, TEXTURE_PIXEL_SIZE);
	COLOR = vec4(cell_uv.x, cell_uv.y, 0.0, 1.0);
}
Tags
tilemap
The shader code and all code snippets in this post are under CC0 license and can be used freely without the author's permission. Images and videos, and assets depicted in those, do not fall under this license. For more info, see our License terms.

More from afk

Palette Swap using two textures

Circle progress mirror

Joepli wobble

Related shaders

Line pattern cell shading

2D Cell/Toon Style Shader

Hexagonal tilemap with blending

Subscribe
Notify of
guest

0 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments