Skip to content

SunLight

The SunLight class creates a directional light that simulates sunlight. It emits parallel rays in a specific direction and supports shadow casting with configurable shadow maps.

Import

javascript
import { SunLight } from "mage-engine";

Constructor

javascript
new SunLight(options);

Parameters

ParameterTypeDefaultDescription
optionsObject{}Configuration object

Options

OptionTypeDefaultDescription
colornumber0xffffffLight color (hex)
intensitynumber0.5Light intensity
namestringAuto-generatedUnique name for the light
positionObject-Initial position {x, y, z}
nearnumber0.1Shadow camera near plane
farnumber100Shadow camera far plane
fovnumber75Shadow camera field of view
mapSizenumber512Shadow map resolution
biasnumber-0.0001Shadow bias to reduce artifacts

Examples

Basic SunLight

javascript
import { SunLight } from "mage-engine";

// Create a default sun light
const sun = new SunLight();

Positioned Sun

javascript
// Sun light from above and to the side
const sun = new SunLight({
  position: { x: 10, y: 20, z: 10 },
  intensity: 1.0,
});

High Quality Shadows

javascript
// Sun with high-resolution shadows
const sun = new SunLight({
  color: 0xffffff,
  intensity: 1.0,
  position: { x: 50, y: 100, z: 50 },
  mapSize: 2048,
  near: 0.5,
  far: 200,
  fov: 90,
  bias: -0.0005,
});

Warm Sunset Light

javascript
// Orange sunset light
const sunset = new SunLight({
  color: 0xff8844,
  intensity: 0.8,
  position: { x: -100, y: 20, z: 0 },
});

Methods

Target Methods

MethodDescription
setTarget(target)Sets the light's target (direction)
getTarget()Returns the current target

Shadow Methods

MethodDescription
setShadow(options)Configures shadow settings
setShadowNearFar(near, far)Sets shadow camera clipping planes
setShadowFov(fov)Sets shadow camera field of view
setShadowMapSize(size)Sets shadow map resolution
setShadowBias(bias)Sets shadow bias

Inherited Methods

MethodDescription
setIntensity(value)Sets light intensity
getIntensity()Returns current intensity
setColor(color)Sets light color
getColor()Returns current color
setPosition(position)Sets light position
getPosition()Returns position
setCastShadow(value)Enables/disables shadows
getCastShadow()Returns shadow casting state
animateIntensity(value, time)Tweens intensity
on(time)Turns light on with animation
off(time)Turns light off with animation

Examples

Setting Target

javascript
const sun = new SunLight({ position: { x: 50, y: 100, z: 50 } });

// Point light at specific location
sun.setTarget({ x: 0, y: 0, z: 0 });

Configuring Shadows

javascript
const sun = new SunLight();

// Enable shadows
sun.setCastShadow(true);

// Configure shadow quality
sun.setShadowMapSize(2048);
sun.setShadowNearFar(1, 500);
sun.setShadowBias(-0.001);

Day/Night Cycle

javascript
const sun = new SunLight({
  color: 0xffffff,
  intensity: 1.0,
  position: { x: 0, y: 100, z: 0 },
});

// Animate to sunset
sun.setColor(0xff6644);
sun.animateIntensity(0.3, 5000);
sun.setPosition({ x: -100, y: 10, z: 0 });

Technical Details

  • Wraps THREE.js DirectionalLight
  • Automatically creates and manages a target object
  • Shadow casting enabled when scene shadows are enabled
  • Includes DirectionalLightHelper and CameraHelper for debugging

Shadow Quality Tips

Map SizeQualityPerformance
512LowFast
1024MediumGood
2048HighSlower
4096Very HighSlowest

See Also