During a university project, I created a ThreeCSG subtraction in ThreeJS. The challenge I am facing now is applying a texture to this mesh due to the missing UV coordinates after processing. The project requirement mandates that it must be a ThreeCSG object.
Here is a snapshot of how the mesh currently appears: screenshot link
While searching for a solution, I came across some code on how to generate UV coordinates in THREE.js which brought me closer to resolving the issue. The side faces now correctly display the applied texture as intended: screenshot link
However, the top side of the mesh has numerous unusual faces. I attempted to use THREE.SimplifyModifier to reduce the number of faces in hopes of being able to manually calculate and set the UV coordinates, but I was unsuccessful.
One potential solution I considered was to iterate over the top and bottom sides of the mesh and somehow "trim" the texture at the edges to mimic the look of a cube. The mesh comprises around 350 faces, so I could set the corner vertices manually, but calculating the UV coordinates for the vertices in between is posing a challenge. I am not concerned about the appearance of the side where the cylinder is cut off, as it will not be visible in the final presentation.
Any assistance or guidance on how to tackle this would be greatly appreciated. Thank you!