본문 바로가기

개발/WebGL | Canvas

[three.js] light

 THREE.AmbientLight 

 기본 광원 장면에 있는 객체의 현재 색상에 빛의 색상이 더해진다.

 THREE.PointLight

 한 점에서 모든 방향으로 확산되는 빛. 그림자X

 THREE.SpotLight

 램프나 등 역할. 그림자O 

 THREE.DirectionLight 

 =infinit light. 태양광의 광선과 비슷. 그림자O

 THREE.HemisphereLight 

 표면 반사나 희미한 하늘을 흉내내어 자연스러운 외부광을 만드는데 사용. 그림자X

 THREE.AreaLight

 공간에서 한 지점 대신 빛을 발산하는 공간을 지정. 그림자X 

 THREE.LensFlare

 광원은 아니지만, 렌즈 플레어 효과를 냄




THREE.AmbientLight

THREE.AmbientLight를 생성하면 색상이 전체에 적용된다. 일반적으로 단독으로는 사용하지 않고, SpotLight나 DirectionalLight와 함께 사용하여 그림자를 부드럽게 하거나 장면에 추가적인 색상을 더하는데 사용한다.



THREE.PointLight

 color 

 빛의 색상 

 distance 

 빛이 도달하는 거리. 기본값은 0으로 거리에 따라 빛의 세기가 줄어들지 않음을 의미 

 intensity

 빛이 비추는 세기. 기본값1. 0이면 아무것도 볼 수 없다.

 position

 THREE.Scene에서 빛의 위치 

 visible 

 true, false 



THREE.SpotLight

 angle 

 광원으로부터 광선이 얼마나 넓게 퍼져 나가는지를 결정. 기본값은 Math.PI/3 

 castShadow

 true면 그림자 만듦 

 color 

 

 distance 

 

 exponent

 THREE.SpotLight에서 발산되는 빛의 세기가 시작점으로부터 얼마나 빨리 감소하는지 결정. 작은 값에서 더 멀리 있는 객체까지 도달. 높은 값에서 가까이 있는 객체까지만 빛이 도달 

 intensity 

 

 onlyShadow 

 true면 그림자만 만들고 장면에 빛을 비추지는 않음 

 position 

 

 shadowBias 

 그림자를 없애거나 그림자의 방향을 객체 쪽으로 이동시킴..? 

 shadowCameraFar 

 광원으로부터 그림자의 거리 결정 

 shadowCameraFov 

 그림자를 얼마나 큰 FOV로 생성하는지 결정. 기본값 50

 shadowCameraNear

 광원으로부터 그림자의 거리 결정 

 shadowCameraVisible

 true면 광원이 어디서 어떻게 그림자를 만드는지 볼 수 있다. 기본 false

 shadowDarkness

 그림자의 어두운 정도를 정의. 렌더링 후 변경할 수 없음

 shadowMapWidth와

 shadowMapHeight

 그림자를 만드는데 사용하는 픽셀의 수. 가장자리가 울퉁불퉁하거나 부드러워 보이지 않은 경우 값을 높인다. 기본값 512. 렌더링 후 변경할 수 없음

 target

 spotLigt가 가르키는 방향. target속성을 특정한 위치나 객체를 지정하면 light의 정 가운데 광선이 해당 위치를 향한다.

 visible

 



THREE.DirectionalLight

spotLight와 유일하게 다른 점은 거리에 따라 빛이 소멸되지 않는다는 것이다. DirectionalLight에 의해 조명되는 전체 영역은 동일한 빛의 세기를 가진다.



- three.js로 3D 그래픽 만들기 ch3


'개발 > WebGL | Canvas' 카테고리의 다른 글

WebGL 기초  (0) 2017.03.02
[threejs] material  (0) 2016.08.14
[three.js] camera  (0) 2016.08.14
[three.js] scene, camera, renderer  (0) 2016.08.12
[WebGL] WebGL 개발 입문  (0) 2016.08.04