Apply same texture size to all faces of a geometry

Hi all! I’m trying to make my textures get applied with the same image size throughout all the texture.


Making the mesh taller stretches the image, since it still wants to have one image per face.

This is the result I’m getting right now (I know it is the intended one). Same repetition applied but the image on the sides of the table shrinks. I would like to have so that no matter what the size of the face is, the image keeps the same aspect ratio (so even if I had a repeatX and repeat Y of 1, the image would not be 1 per face).

I tried setting the UV of the geometry according to the size of the mesh but without any luck:

function assignUVs(meshRef: Node) {
  if (!meshRef.current) return

  const boundingBox = new Box3().setFromObject(meshRef?.current)
  const size = boundingBox.getSize(new Vector3())
  meshRef.current.material.userData.fitTo = size.x / size.y
  console.log('test', meshRef.current.material.userData.fitTo)

  if (meshRef.current.material.userData.fitTo > 0) {
    var geometry = meshRef.current.geometry
    var textureFitTo = meshRef.current.material.userData.fitTo

    var uvs = geometry.getAttribute('uv').array

    for (var i = 0; i < uvs.length; i += 2) {
      var u = uvs[i]
      var v = uvs[i + 1]

      var newU = u / textureFitTo
      var newV = v / textureFitTo

      uvs[i] = newU
      uvs[i + 1] = newV
    }

    geometry.getAttribute('uv').needsUpdate = true
  }
}

But without any luck. The only instance where I was able to get this right is with walls and floors in my app, where I would basically multiply the width and height of the mesh with the repetition factor, so the repetition adapts to the size of the mesh, giving this result:


The size of the images with a wall of width 2000 and 4000 is the same. But I cannot apply this my furniture meshes since I do not know (and if I’m not wrong, I can’t know) the size of all the faces, since the first model is a GLB model.

So how would I be able to to achieve this result on all my furniture? Is this even posible via standalone Three? I’ve read managing seams on Blender can fix this, but I do not know if this is going to give me the same result as with my walls.

Any help or indications on this topic are highly appreciated!

Edit: my furniture can have any shape, round, spheric, triangle… and the surface is not always flat

These might give some clues:

Thanks for the resources! I will give them a look in a couple hours. Will this work, say, for any kind shape? Say I have this furniture:


Is this also valid, even for the pillows?

The second link might work for various shapes, but it is not guaranteed that the result will be what you expect. Generally, setting UV coordinates is an artistic process. It is hard to impossible to make it entirely by an algorithm, that’s why digital artists often use some tools that help with this. At the end of the day, it is always a human that fixes things.

Blender might help you set up good UVs.

There is also other options, like texture projection (demo: https://jsfiddle.net/mmalex/pcjbysn1)