Tilemap gaps when camera moves


#1

I’m running into an annoying issue where anytime my camera moves gaps shows up between my tiles.

gapInTilemap

My camera is following a GameObject that tweens from tile to tile. There is no lerp on the camera and the duration for each tween is one second. I’m using static tilemap layers and I set the roundPixel parameter for startFollow to true.

I’ve looked at the tilemap examples and none of them seem to have this issue. The only real difference is that my camera is following an object that’s being tweened instead of key controls.


#2

That’s always a possibility on WebGL even with roundPixel, because GPUs work in floating point. It’s called pixel bleeding and the way to fix it is to extrude your textures. That means repeating the border pixels of a tile in additional column/row. That way if the GPU samples pixels slightly off, it will still have the correct color.
See https://github.com/sporadic-labs/tile-extruder for script to handle that for you.


#3

That’s possible, though I’m forcing Canvas and not using WebGL. Regardless adding some padding to my tiles may fix it. I’ll give it a try.


#4

Before and after using above tile extruder.


#5

Extruding my tiles fixed it. Thanks @Antriel