uIM7AI9S
uIM7AI9S

Reputation: 399

How apply directional light only for a limited zone in Three.js?

I want to light up everything around the player in a similar way how directional light does with the whole scene. Since I'm working on an top-down view project, I should be able to see an elipse of light on the ground

I have tried to achieve the effect by using 2 layers: one for everything except area-to-be-lit, and another one containing area-to-be-lit and an extra light source:

new three.SpotLight(0xffffff, .6, 0, Math.PI / 3, 0, 0);

The light is always on the top of the player and the player is its target

It works, but there are 2 problems: it is not directional light, so I can't achieve those good-looking shades on different faces; and the light isn't making an elipse all the time:

enter image description here

When the light is casted on imported models, it is indeed a nice elipse on the ground around the player, but for programatically made geometries, it doesn't seem to be the case. My guess is that one face can only have 1 color applied from the light source, but making the geometry more complex will add additional overhead on top of the proper light calculations

I was thinking if it's possible to limit the directional light to affect just inside a sphere

Upvotes: 0

Views: 373

Answers (1)

Epiczzor
Epiczzor

Reputation: 427

I think you can make use of Layers : https://threejs.org/docs/#api/en/core/Layers

Also, try using a light from an HDR (Check PMREM Generator), it could give nice results that you can combine with your light and make the scene look better.

Upvotes: 0

Related Questions