I've been attempting to apply a textured mesh with unique UV coordinates for each face, but despite following all the necessary steps, I haven't achieved the desired results.
To start, I define the texture coordinates:
top_texture_uv = [new THREE.Vector2(0,0), new THREE.Vector2(8,0), new THREE.Vector2(8,8), new THREE.Vector2(0,8)];
side_texture_uv = [new THREE.Vector2(0,0), new THREE.Vector2(4,0), new THREE.Vector2(4,2), new THREE.Vector2(0,2)];
I want the faces to repeat different times.
Next, after loading the texture, I update the geometry's face vertexes as mentioned in the documentation:
var txLoader = new THREE.TextureLoader();
txLoader.load(
'textures/checker.gif',
function ( texture ) {
ground_segment.mesh.material.map = texture;
ground_segment.mesh.geometry.faceVertexUvs[0] = [];
// Mapping UV coordinates to individual face vertices
// Repeat this process for required number of face repeats
...
ground_segment.mesh.geometry.uvsNeedUpdate = true;
ground_segment.mesh.material.needsUpdate = true;
}
);
Despite my efforts, mapping face vertices doesn't seem to have any impact. Instead, it simply loads the texture without repeating on every face of the object. How can I adjust the geometry to reflect the specific UV coordinate changes I'm aiming for?