Blender 3d objects losing quality and showing strange lines in three js

I recently made a object scene in blender and after importing it in Threejs it is showing strange lines and wires on the chair surface:
Screenshot from 2021-08-28 09-27-06
Screenshot from 2021-08-28 09-27-30

code:
gtlfLoader.load("/Chairs/BB_004.gltf", (gltf) => { scene.add(gltf.scene); });

Its maybe shadow bias. If white chair is texture (not color) then maybe its too small or not filling and black pixels appear like this:
image

looks like baking overlap. you need to space uvs out, and then bake a little margin. if you’d connect the baked texture to the model in blender it would probably look the same. hard to pinpoint without a model though. if you can, upload it, that could help tracking it down.

https://drive.google.com/drive/folders/1yF0vvAG8mzXTc5KWOAp3PkABr5Jn34dw?usp=sharing
required GLTF files

Filled in photoshop.

To increase result, i think you can select all top uv map of chair and place to the top of uv map and back chair into bottom. Because front and back of chair are crossing in texture and it more visible then webgl select small mimap variant of texture.

some of the uvs seems to overlap, or are dangerously close, you see it in the uv editor

uv isles need a margin that is bigger than the baking margin. i use uvpackmaster2 for that which does an OK job.

1 Like