How to add shadows to imported child meshes?

Hi! Is there a simple way of adding shadowCasters to all imported meshes including the children?

I can achieve it by using (see playground rows 79-106):

var plate1 = result.meshes[0];
var plate2 = result.meshes[1];
var plate3 = result.meshes[3];
etc.

It works well here, but in another import file I will have 54 meshes. Which would make 54 rows if I did it like this… I’m sure I can get the same result as above with a row or two, but for all 54 meshes.

I have tried something like:

var children = plate1.getChildMeshes();
shadowGenerator.addShadowCaster(children);
children.receiveShadows = true;

But it doesn’t seem to work…
Any help would be appreciated.

Monkey shadows | Babylon.js Playground (babylonjs.com)

Hi,

getChildMeshes is array

var childrens = plate1.getChildMeshes()[0];

Or

var childrens = plate1.getChildMeshes();
for(let i = 0; i < childrens.length; i++) {
    shadowGenerator.addShadowCaster(childrens[i]);
}
2 Likes

Thanks! This worked, but only for some of the meshes. I guessing that I need get into layers within layers of parenting somehow… I still have some meshes in the imported model that do not cast shadows on each other.

How can I go even deeper?

I tried the following without any luck…
var children1 = plate1.getChildMeshes()[1];
var children2 = plate1.getChildMeshes()[2];
var children3 = plate1.getChildMeshes()[3];

getChildMeshes by default returns all of the meshes on the hierarchy, including indirect descendants, so this shouldn’t be needed. There might be other factors influencing your shadows, like those explained here: Shadows | Babylon.js Documentation (babylonjs.com)

I think I have narrowed down the issue somewhat. The issue is in the other project where I have 53 meshes that I want the shadows.

Looking in the Nodes and root I have this.

If I try to remove the root using the method shown at 3.49 in the video here Thin Instances | Babylon.js Documentation (babylonjs.com) I only have the “Nut” mesh left in my scene… Every other mesh is removed.

If I do like this:

var plate1 = result.meshes[0];

var children = plate1.getChildMeshes();
for(let i = 0; i < children.length; i++) {
shadowGenerator.addShadowCaster(children[i]);
}

children.receiveShadows = true;

I only get shadows on some of the meshes, and the “child” meshes does not cast shadows on each other… (Red = no shadows casted on each other, Blue = Shadows are casted from some meshes.)

But “console.log(children);”

gives me all the meshes (but in an Array?). How do I give meshes in an Array shadows since the above does not work?

Ps. I have also tried to restructure things in my .blend file before exporting the .glb, but that doesn’t seem to do anything regarding my issue.

The issue was solved by @mawa in Shadow for an whole building - Questions - Babylon.js (babylonjs.com)

These lines from that topic solved the issue I was having here:

let parent = scene.getMeshByName(“_ root _);

// shadows handling
var shadowGenerator = new BABYLON.ShadowGenerator(2048, light);

let mymesh = parent.getChildMeshes();
for (var i = 0; i < mymesh.length; i++) {
mymesh[i].receiveShadows = true;
shadowGenerator.addShadowCaster(mymesh[i]);
}

1 Like