I recently imported a .obj file into my project using the following code:
OBJLoader.load('/models/model.obj', m => {
let model = m.children[0];
model.material = new THREE.MeshBasicMaterial();
scene.add(model);
});
To modify the map separately, I decided to replace the default material with a THREE.MeshBasicMaterial.
Afterwards, I obtained a CanvasTexture and assigned it as the map:
let texture = new CanvasTexture(canvas);
model.material.map = texture;
model.material.needsUpdate = true;
Although this method seemed to work, I encountered an issue where the texture appeared 'zoomed in' on the object within the scene, displaying only the overall color of the texture without any fine details. Despite adjusting texture.repeat, I struggled to achieve my desired outcome:
I aim for the texture to cover the entire object completely and scale appropriately across all faces without any repetitions. The object was created in Blender and consists of multiple faces, hence my goal is to have the texture fill every face seamlessly.
Any suggestions on how I can accomplish this?
Edit: You can find the model I'm working with here https://drive.google.com/drive/folders/1y6NmxNpamCtWsiBPlDhndnvQbxYPVgB7?usp=sharing