0

a bit of a long and somewhat open ended question here, and I'd love to get help and opinions on this:

I've got a 3D model (mesh exported in Collada format) of a long-sleeve shirt. It's a men's dress shirt, size 16 neck, 34 sleeve, etc. accurately modeled.

I have three fabrics - all three fabrics are polka-dots (maybe I'm a clown). Their details are as follows:

  1. 1" red polka dot fabric has a 1-inch diameter dot that repeats every inch (the dots are essentially touching)
  2. 3" blue polka dot fabric has a 3-inch diameter dot that repeats every three inches (the dots are essentially touching)
  3. 7" green polka dot fabric has a 7-inch diameter dot that repeats every seven inches (the dots are essentially touching)

I scanned each fabric at 32ppi and made texture maps which will seamlessly repeat (easy as they were polka dots). So now I have:

  1. red-polka-dot.png is 32x32 pixels
  2. blue-polka-dot.png is 96x96 pixels
  3. green-polka-dot.png is 224x224 pixels

I would like to use threejs to show what each fabric would realistically look like on my shirt (repeating the correct number of times on the shirt based on the size of the dot)...

As far as I see, I've got two problems:

  1. I have "Non-Power of Two" textures
  2. I have one UV space on my model (maybe it corresponds to the Red Polka Dot fabric, so it repeats that every inch as it should)

Is it possible to accomplish what I'm looking to do? Are there alternatives that I should explore?

Thanks in advance.

Matt Pavelle
  • 819
  • 5
  • 8

1 Answers1

-1

maybe this is of help for problem 2) How to repeat the texture map like GL_REPEAT?

for 1) Just get you a photo editing software like gimp or photoshop and get your textures in a power of 2 resolution would be my suggestion if you have problems with texture tiling like here: Three.js Repeat texture fail

Community
  • 1
  • 1
GuyGood
  • 1,377
  • 1
  • 9
  • 12
  • Hey GuyGood - thanks for the response. The problem is I need the 1" polka dot to repeat every 1-virtual-inch on the model, the 3" to repeat every 3-virtual-inches, and the 7" to repeat every 7-virtual-inches... I can't make all of them 1024x1024 (or any power of two) because they don't share a common denominator thus they won't all repeat seamlessly at 1024x1024 at the same PPI. So I'd need multiple UV spaces, as far as I can tell... ? – Matt Pavelle Feb 26 '14 at 15:46
  • no, just try texture tiling in three.js and play with the values to get an understanding. As far as i understand, you have an unwrapped t-shirt and what would you do to get your x"-scaling? You would scale the UVs proportionally in size like 1 times for 1 inch, 1/3 to have the 3 inch scaling etc.(or something like this, i havent seen your textures and unwrap). Anyway, you can just play with the number of repetitions of the texture to achieve the same effect. Only problem will be to get your correct scaling. For this, you will have to play with the values to match them as close as possible. – GuyGood Feb 26 '14 at 19:13
  • and you can keep your textures in an appropriate resolution, like 64x64 or 128x128 and 256x256 (for your three textures). The resolution is not in an relation to the texture tiling you want to achieve. Just try different tiling values to get a better understanding of what is going to happen. From y point of view, this will do the trick for you but maybe i did not understand the problem. – GuyGood Feb 26 '14 at 19:15