Each vertex in a 3d model has an additional 2d coordinate associated with it… called the “uv” coordinate, or a “texture coordinate”. You can use 3d modelling software like Blender to visualize and edit these coordinates.
I loaded your texture into blender, and added it to a cylinder:
That is what the default mapping looks like ^
(uv map is the image on the left, the 3d view is on the right)
I did some editing of the uv’s and vertices and came up with this:
You can export from blender as a glb (binary gltf) file and load it in your app… then just switch out the material.map to the image you need, assuming it has the same layout.
Here’s the .blend file…
shashant.blend (1.2 MB)
And the exported .glb
shashant.glb (258.7 KB)
that you can drag on here:
To preview it.
