I'm trying to customize a cube by attaching different images to each side, but I'm encountering issues in the process. When I attempt to assign individual images to specific sides, they don't render correctly. It only works when I set all sides to display the same image.
var textureLoader = new THREE.TextureLoader();
var textures = [];
for (let i = 0; i < 6; i++) {
textures.push(textureLoader.load(`images/${i}.png`));
}
var cubeMaterials = [];
textures.forEach(texture => {
cubeMaterials.push(new THREE.MeshBasicMaterial({ map: texture }));
});
var cubeGeometry = new THREE.BoxGeometry(3, 2, 3);
let cube = new THREE.Mesh(cubeGeometry, cubeMaterials);
group.add(cube);