Load obj model with set UV Map and add Texture only front side

Hello,
I can’t deal with the problem.
I have a 3d model on which I use UV map in 3dsMax.

As you can see, I do it as a box with the dimensions of the element.
I would like to get to the front wall of this box and put only texture on it.

In general, I made a canvas (fabric js) with the same dimensions as the UV map and I want to add some background and write something, and then load it to the front of the 3d model. At the moment when I add a texture, it is added to all pages.

How do you find this front part? Should I add something to the .obj file in 3ds Max? Maybe the UV map doesn’t matter at all?

I would like to add an example in JsFiddle, but unfortunately time doesn’t allow me. If I find time, I will try to add it, but maybe someone already knows how to solve it. It’s probably not difficult, but I can’t handle it.

I suggest you split your object into two. You can then assign texture coordinates only to the front part.

Do you mean the split into “front element” and “rest of element” in 3dsMax? Unfortunately, I can’t edit it in the program, I only have to do it in JS.

Yep.

Why not? Doing this in code is much more complicated (since you need group data in order to assign multiple materials to a single object).

Too long to talk about it, but so briefly.


In the .obj model I have several elements. Each element has a name. For example, when I load a model, I have 4 items on scene. All elements have a texture to start with. when I click one, I get dimensions and link to textures and draw a canvas with the same background as in the model. After adding text to the canvas, I want to update the model with texture from the canvas. This example has 4 elements, but there can be more elements. When I split each element and click one, I click the front or the rest of the element, not the whole.
Maybe if I didn’t have models, and now I could create them, I could try, but .obj files are already very, very numerous. Maybe I’ll look at these groups in bufferGeometry.

Okay, you just have to make sure to create two groups representing the two parts of your geometry. You can then create an array of materials (one material with texture and one without it) and apply it to the mesh.

After a week try debuging code I found this solution

step 1: if 3d object loaded , than set it uv in any 3d software (example blender) to Modal, this will add more mesh to object in three code and export. Than load in threejs.

step 2: You can get Mesh detail by console log 3d object in threejs code

step 3: Than replace UV map with what desire uvmap, I assign uv2 to uv as in screen shot