What does the textures map do for a SpotLight and do I need one?

I am a programmer and not a digital artist or graphics person so this question may seem odd. I have been looking at the code for the SpotLight example found in the ThreeJS lights examples list. I found this block of code where a mini-menu is built for the ThreeJS SpotLight example:

            const params = {
                map: textures[ 'disturb.jpg' ],
                color: spotlight.color.getHex(),
                intensity: spotlight.intensity,
                distance: spotlight.distance,
                angle: spotlight.angle,
                penumbra: spotlight.penumbra,
                decay: spotlight.decay,
                focus: spotlight.shadow.focus,
                shadows: true
            };

I was surprised to see a textures map parameter because I thought textures only applied to models. How does a texture apply to a PointLight (or any light object type)? What effect results from having the “disturb.jpg” texture assigned to the map property and how different would it look if a different JPG was used?

Also, do I have to have a map property value when creating a PointLight. If not, can I just leave the map property uninitialized? If I can’t what should I assign to it instead?

Be sure to checkout the examples, I know there’s a ton but it generally covers most weird cases on paper and when you see it it makes sense.

Here’s the spotlight demo: three.js examples

Very recently actually the ability to PROJECT from the spotlight was added.

This could be extended to things from image effects (see demo) to cookies (light blockers) to modeling very accurately real world light forms.

If you want to project a texture without animating or changing it, decals would be better

Thanks. Is there a document somewhere that explains what projecting a texture means? I can’t seem to wrap my head around that idea.

Imagine a movie projector or a slide projector from school.

The image is placed in front of the light and then like a movie projector the image spreads through space.

When it hits a surface it will lay that image against the surface (like a movie screen) and also can distort (like if you projected onto a mountain texture)

There’s a bunch of different names for it, But “Projected Texture” or “Texture Projection” is most common.

See this thread of Paul making a version a few years ago with a nice example

Also, go to the spotlight example I sent, it has helpers and guides to show you what the light is doing.
Open the raw image file to see the baseline image then compare to the 3d scene… see how it gets spread and what all the options do etc

1 Like