I'm attempting to generate a textured surface along a path in three.js, aiming for a tiling/repeating effect similar to what can be achieved in Blender. Creating individual faces manually and applying textures works well for simple paths like straight lines but becomes complex for more intricate designs.
One technique offered by three.js is ExtrudeGeometry. Applying a texture to a mesh created through this method reveals the default UV mapping:
It appears that a custom UVGenerator function needs to be implemented and passed to ExtrudeGeometry. However, there seems to be a lack of documentation on this topic. Existing resources found through searches either refer to outdated information or remain unanswered.
A JsFiddle example demonstrates the default behavior. The included uvGenerator() function mimics THREE.WorldUVGenerator for ease of experimentation.
I've experimented with converting vertex coordinates into a normalized 0-1 range according to the geometry's bounding box size. Unfortunately, this approach did not yield the desired outcome. Additional calculations within the generateSideWallUV function were attempted without success.
The inability to extract pertinent information regarding the extruded path length from the available documented sources has raised further questions about the feasibility of a custom UV generator solution.
Any assistance or guidance would be greatly appreciated.
Update: Dividing vertex coordinates by the bounding box size does not resolve the issue as the bounding box parameters remain indefinite when generateSideWallUV() is called during ExtrudeGeometry operation.
This scenario leads to unexpected results and highlights the challenges in implementing a customized UV generator for this specific task.
If there are alternative approaches or overlooked aspects (such as reconsidering the use of ExtrudeGeometry), I am open to suggestions and enlightenment.