Seams showing on a tiled mesh - unable to fix

Hello everyone,

I have an issue i have been unable to resolve through usual means of searching documentation and API.

Preview
https://zippy-shine-hardboard.glitch.me/

The code:

I created an example above that shows the model and the textures and in the scene you can see the seams showing.

I’ve tried setting the map minFilter and MagFilter to NearestFilter or LinearFilter but that only makes the image VERY pixelated, so I am unable to use that, and it sometimes does not remove the seams.

Is there a way to make this work?

The asset

The asset is a simple glb made in Blender where the mesh has been divided into 4 and each part has a material of its own with its own UV. Each material contains 1 map which is used to create the final image.

Any suggestions to fix this?

First solution set MirroredRepeatWrapping

for(var n=0;n<4;n++){
scene.children[0].children[0].children[n].material.map.wrapS=scene.children[0].children[0].children[n].material.map.wrapT=THREE.MirroredRepeatWrapping;
scene.children[0].children[0].children[n].material.map.needsUpdate=true;
}

image

Second solution. Your UV coordinates too close to borders. Add some paddings

You’re a lifesaver! thank you!

And also, when I add some paddings it seems to affect the final image and cut out part of the image? How can i add padding in Blender?

I am using 3ds Max. And then i export model, the program auto add some paddings.
Example. My UV coordinates in 3ds max was x 0 y 0. But after export UV set to x 0.0005 y 0.0005
UV was x 1, y 1. But after export UV set to x 0.9995 y 0.9995
image

1 Like

Interesting…I originally put the model together in 3ds max before adjusting the UVs in blender to maximum extents