Currently, I am attempting to create a skybox but have encountered difficulties with various tutorials. Initially, I tried to use an array approach to pass parameters for the material based on a previous example, but it seems that the method has been updated to TextureLoader() since then. Below is my code snippet:
// Implementing a skybox
var skyBoxMaterials = [
new THREE.MeshBasicMaterial({ map: new THREE.TextureLoader('images/skybox/sky1.jpg') }),
new THREE.MeshBasicMaterial({ map: new THREE.TextureLoader('images/skybox/sky2.jpg') }),
new THREE.MeshBasicMaterial({ map: new THREE.TextureLoader('images/skybox/sky3.jpg') }),
new THREE.MeshBasicMaterial({ map: new THREE.TextureLoader('images/skybox/sky4.jpg') }),
new THREE.MeshBasicMaterial({ map: new THREE.TextureLoader('images/skybox/sky5.jpg') }),
new THREE.MeshBasicMaterial({ map: new THREE.TextureLoader('images/skybox/sky6.jpg') }),
];
var skyBoxGeom = new THREE.CubeGeometry(10000, 10000, 10000, 1, 1, 1);
skyBox = new THREE.Mesh(skyBoxGeom, skyBoxMaterials);
skyBox.position.set(0, 25.1, 0);
scene.add(skyBox);
Upon running the code, I encounter the error "Uncaught TypeError: Cannot read property 'x' of undefined" in the console, persisting until the server is stopped. Despite searching through examples, documentation, and similar questions, I have not found a solution. Any recommendations?
UPDATE: After further investigation, I came across a suitable example in the documentation under cubeGeometry, although the skybox still fails to render. Here is the updated code snippet:
// Creating a skybox
var loader = new THREE.CubeTextureLoader();
loader.setPath('images/skybox/');
var textureCube = loader.load([
'sky1.jpg', 'sky2.jpg',
'sky3.jpg', 'sky4.jpg',
'sky5.jpg', 'sky6.jpg'
]);
var skyMaterials = new THREE.MeshBasicMaterial({ color: 0xffffff, envMap:
textureCube });
var skyBoxGeom = new THREE.CubeGeometry(10000, 10000, 10000, 1, 1, 1);
skyBox = new THREE.Mesh(skyBoxGeom, skyMaterials);
skyBox.position.set(0, 25.1, 0);
scene.add(skyBox);
No error messages are present in the console, yet the cube fails to render. Interestingly, other items in the scene render correctly.