Light

Light

  • AmbientLight -> 주변광, intensity를 낮추어 오브젝트의 형태만 보이게 표현할 때 자주 사용된다.

  • HemisphereLight -> 주변광, 반원을 중심으로 상하에서 비추는 빛의 두 가지 색상을 설정할 수 있다.

  • DirectionalLight -> 방향성을 가진 빛 (ex: 햇빛)

  • PointLight -> 방향없이 사방으로 퍼지는 빛 (ex: 백열등)

  • SpotLight -> 한곳으로 집중된 빛 (ex: 무대 조명)

Properties

  • color: 빛의 색상

  • intensity: 빛의 강도

  • target: 오브젝트 대상의 포지션값으로, light의 position을 기준으로 target의 position값을 계산하여 Light의 각도(rotate)를 재계산한다. (default: 0,0,0)

  • distance: 빛의 거리

  • penumbra: [spotlight] 빛의 감쇠율 조절

Shadow

  • castShadow: Mesh에 자신의 그림자 생성 여부

  • recieveShadow: 자신 또는 다른 Mesh에 의해 생성된 그림자에 영향을 받는지 여부

  • shadowMapSize: shadowMap의 크기를 조절하여 그림자 해상도 조절, shadow도 texture처럼 렌더링됨

SpotLgith

특정 방향으로 집중된 빛을 방출하는 조명, 빛이 멀어질수록 크기가 커지는 원뿔을 따라 방출된다.

const spotLight = new THREE.SpotLight(
  0xffffff, // color(색상)
  2.5, // intensity(감도)
  30, // distance(빛이 닿는 거리)
  Math.PI * 0.15, // angle(빛이 퍼지는 각도)
  0.2, // penumbra(빛이 감쇠하는 정도)
  0.5 // decay(거리에 따라 어두워지는 양)
);
spotLight.position.set(0, 0, 3);
scene.add(spotLight);

Target

  • spotLight는 빛을 어떤 타겟을 향해 방출 할지에 대한 정보를 가지고 있는데 기본적으로 원점을 향해 방출된다.

spotLight.position.set(0, 0, 3);
spotLight.target.position.set(0, 0, 3);

scene.add(spotLight, spotLight.target);

Texture

  • 빛의 색상을 조절하기 위한 용도로 texture를 입힐 수 있다.

  • 광원에 입히는 텍스쳐는 색안경 같은 효과를 갖는다.

  • 빛이 텍스쳐를 투과하면서 텍스쳐의 색상이 입혀지는 것으로 이해하자.

const textureLoader = new THREE.TextureLoader().setPath('./assets/textures/');
const lightTexture = textureLoader.load('gradient.jpg');
spotLight.map = lightTexture;

Last updated