NgtsRandomizedLights

NgtsRandomizedLights is a port of Drei’s RandomizedLights which creates a randomized light that internally runs multiple lights and jiggles them around to create realistic raycast-like shadows and ambient occlusion.

This component is context-aware: when paired with NgtsAccumulativeShadows, it will automatically take the number of frames from its parent.

1
<ngts-accumulative-shadows [options]="{ temporal: true, frames: 100 }">
2
  <ngts-randomized-lights
3
    [options]="{
4
      amount: 8,
5
      radius: 4,
6
      ambient: 0.5,
7
      bias: 0.001,
8
      position: [5, 5, -10],
9
      intensity: Math.PI,
10
      mapSize: 512
11
    }"
12
  />
13
</ngts-accumulative-shadows>

You can also use it standalone for dynamic shadow effects:

1
<ngts-randomized-lights
2
  [options]="{
3
    amount: 4,
4
    radius: 2,
5
    position: [0, 10, 0],
6
    castShadow: true
7
  }"
8
/>

Options

options input accepts any properties from THREE.Group in addition to the following:

Properties

name	type	description
frames	number	How many frames it will jiggle the lights. Default: 1
amount	number	The number of lights to create. Default: 8
radius	number	The radius within which the lights will be randomly positioned. Default: 1
ambient	number	The ambient light intensity. Default: 0.5
position	[number, number, number]	The base position of the lights. Default: [0, 0, 0]
intensity	number	The intensity of the lights. Default: Math.PI (Three.js 155+)
bias	number	The shadow bias for the lights. Default: 0.001
mapSize	number	The size of the shadow map for the lights. Default: 512
size	number	Size of the shadow camera frustum. Default: 5
near	number	Shadow camera near plane distance. Default: 0.5
far	number	Shadow camera far plane distance. Default: 500
castShadow	boolean	Whether the lights cast shadows. Default: true