Im buildig on a project with an unfamiliar gltf loader, and I want to add shadows to it. The loader is set up like this in a separate utils.js:
function loadResource(url) {
const extension = url.split('.').pop();
let loader;
switch (extension) {
case 'jpg':
loader = new THREE.ImageLoader();
break;
case 'glb':
case 'gltf':
loader = new THREE.GLTFLoader();
break;
default:
return Promise.reject(new Error(`unknown resource type [${extension}]`));
}
return new Promise((resolve, reject) => {
const onLoad = (resource) => resolve(resource);
const onProgress = () => {};
const onError = (e) => {
console.error('Failed to load resource: ' + e.target.src);
reject(e);
};
loader.load(url, onLoad, onProgress, onError);
});
and the main.js is using an async:
(async function init() {
utils.loadResource('model/SPACEBOX.jpg').then((cubeTexture) => {
const skyBox = new THREE.CubeTexture(utils.sliceCubeTexture(cubeTexture));
skyBox.needsUpdate = true;
scene.background = skyBox;
});
const [wheelGLTF, chassisGLTF, terrainGLB, baseGLB] = await Promise.all([
utils.loadResource('model/lwheel.gltf'),
utils.loadResource('model/car.gltf'),
utils.loadResource('model/floor.glb'),
utils.loadResource('model/building.glb'),
]);
const terrain = terrainGLB.scene;
scene.add(terrain);
const wheel = wheelGLTF.scene;
const chassis = chassisGLTF.scene;
const base = baseGLB.scene;
/// base.castShadow = true <failed attempt
scene.add(base)
Loading the models like this seems really good but how do I add a shadow to this kind of setup? Cheers