Colour calculated only by distance from light source, ignoring surface normals

In my scene I have flat objects (pseudo 2D) with light source in the middle, camera is static (isometric view). I want to achieve light effect like in Dont Starve:

As you can see, top bush and bottom right are in similar distance from light source. In real live bottom-right bush would be much darker than top one, because we would look at its dark side, not illuminated by light source.
In this fiddle: https://jsfiddle.net/980hx2c1/ i have similar situation, I want bottom right plane to be illuminated exactly the same as top one. This would be possible if the shader calculates final colour based on distance from light only and ignoring angle between light ray and vector normal to surface.

Can I achieve the same light effect using any specific material available in three js? Or should I create custom shader and calculate fragment final colour using formula:
finalColor = mix(materialBaseColor, blackColor, distanceFromLight * factor)?

You should be able to achieve it with any material - as long as you don’t add any actual light source to the scene, except maybe for ambient light (alternatively you can use emissive property on materials to brighten objects.)

Basically, what you may do it just use MeshStandardMaterial / MeshPhongMaterial / MeshBasicMaterial - and depending on the distance of the light source, adjust .color property on the material (material texture map is multiplied by color value, so for 0x000000 you’ll get black object, for 0xffffff you’ll get textured object.)

1 Like

Great idea, it works! Thank you!