Is there a SpotLight helper (like for the DirecionalLight)?

Hello, looking in the docs of the shadows I’ve seen the code for the “DirectionalLightHelper”, to better tune the frustrum of the light shadow.
Since I have some issues to set the angle, shadowMinZ and shadowMaxZ of my spotlight (them seem not to do anything…) I’m wondering if is there’s somewhere the code for the same helper for the spotlight, without not to have to spend days to write a new one.
It would be very useful.
Many thanks!

Hi! I took a look and there doesn’t seem to be a SpotLightHelper :frowning: But I wonder if we can’t get something similar by getting the transform matrix of the shadow generator, applying to a camera, and using the Camera Gizmo to visualize it. I’m going to try it to see if it works.

About the shadowMinZ not doing anything, also looked at how the Spot Light gets this value, and it depends on quite a few variables. like this engine.useReverseDepthBuffer, so might be worth looking into it too? Babylon.js/spotLight.ts at master · BabylonJS/Babylon.js (

Ended up not using the transform matrix directly, but setting the camera properties according to the light properties:

Spotlight Not Blocked By Mesh | Babylon.js Playground (

I think it works out nicely in the end to understand how the shadow is generated from the light, since a shadow map technique amounts to rendering the scene from the point of view of the light.

I tried forcing a “weird situation” here as a way to better explain it. Here we have quite a strange shadow:

But once we turn on the camera gizmo it starts making sense:

Since the shadowMaxZ value is pretty low here, the light “camera” can’t see the cube in its entirety, only some parts. And if we use the inspector to actually look at the scene from the light “camera” POV, that’s exactly what we get!


I hope this helps. :slight_smile:


Wonderful job! I’ll put in in a class and I’ll share it

1 Like

Would make a really cool PR :slight_smile:

I’ve made very quickly a class for the SpotLightHelper and I didn’t test it with more than one light.
I’m really a newbie with Babilon and I’m not so good with JS in general, so probably I’ve made something wrong.
Anyway, I think that would be nice to use a Spotlight gizmo in place of the Camera one, but as far as I understand it would require a lot of work.

P.S. I think that this class would require at least a Build and Dispose method, but actually I’ve not the knowledge to do that.
I’ve tried to set the camGizmo = null but the gizmo is still there… :grinning_face_with_smiling_eyes:

P.S.2 for the PR I would suggest to be able to use transform gizmo to modify angle, z-min, z-maz, etc directly in viewport!

EDIT: I’ve seen that my last modify in the code has not been saved, and there’s no way to save it.
Maybe it could be a bug in the Playground, anyway just please modify the “setUpdate” function in this way:

setUpdate() {
this.updateInterval = window.setTimeout(() => {
this.scene.onAfterRenderObservable.add(() => this.update());
}, 500);

1 Like