After recently transitioning to three.js as my renderer, I am eager to establish a texture mapping system. However, determining the best practice for this task is a bit uncertain for me. Here is the scenario I am dealing with:
- My levels consist of numerous box geometries
- I require the ability to map a diverse range of textures to each face of every box geometry (such as grass, water, stone, rock, etc.)
- I aim to achieve this in the most efficient, performance-conscious manner possible, preferably by offloading it to the GPU
- I am utilizing the Web GL renderer
Currently, my textures are organized in a sprite sheet; each texture is a 64x64 pixel square, with each unique texture offset by 64 pixels based on its position.
Is this approach necessary, or would it be better to have a directory full of various textures, looping through them and creating a new instance of
THREE.ImageUtils.loadTexture( "textures/someTexture.png" );Alternatively, is there a more efficient method to accomplish this task?