종종 lerp로 약칭되는 선형 보간은 주어진 두 값 사이의 중간 값을 찾는 데 사용되는 수학 함수입니다. 결과 값은 주어진 두 값 사이의 비율에 의해 결정됩니다.
간단한 1차원 예에서 수직선에 값이 10인 지점 A와 값이 20인 지점 B가 있다고 가정합니다. 특정 지점에서 두 지점 사이의 중간 값을 찾으려면 A에서 B까지의 30%로 선형 보간법을 사용합니다.
선형 보간에 대한 공식은 다음과 같습니다.
결과 = (1 - t) * A + t * B
이 공식에서 t는 두 점 사이의 비율을 나타냅니다. A에서 B까지의 30% 지점을 찾으려면 t는 0.3이 됩니다. 값을 연결하면 다음을 얻을 수 있습니다.
결과 = (1 - 0.3) * 10 + 0.3 * 20
결과 = 7 + 6
결과 = 13
따라서 중간 값은 13이며 10에서 20까지의 30%입니다.
선형 보간법은 2차원 또는 3차원에서 선이나 평면의 점을 찾는 것과 같이 더 높은 차원에서도 사용할 수 있습니다.
또한 일반적으로 컴퓨터 그래픽 및 애니메이션에서 색상 변경 또는 객체 이동과 같은 두 값 사이의 부드러운 전환을 생성하는 데 사용됩니다.
Three.js의 Color 클래스에는 .lerp(), .lerpColors() 및 .lerpHSL()의 세 가지 선형 보간 방법이 있습니다.
.lerp() 메서드는 색상의 RGB 값을 다른 색상의 RGB 값으로 선형 보간합니다. 두 번째 인수인 alpha는 두 색상 사이의 비율을 나타냅니다. 여기서 0.0은 원래 색상이고 1.0은 대상 색상입니다.
.lerpColors() 메서드는 색상이 두 입력 색상 사이에 선형으로 보간되도록 설정합니다. alpha 인수는 두 색상을 연결하는 선을 따라 백분율 거리를 나타냅니다. 여기서 alpha = 0.0은 시작 색상이고 alpha = 1.0은 끝 색상입니다.
.lerpHSL() 메서드는 색상의 HSL(색조, 채도 및 밝기) 값을 다른 색상의 HSL 값으로 선형 보간합니다. .lerp()와 달리 이 방법은 한 색상에서 다른 색상으로 바로 보간하는 대신 두 색상 사이의 모든 색조를 통과합니다. 알파 인수는 .lerp()에서와 동일하게 작동하며 0.0은 원래 색상이고 1.0은 대상 색상입니다.
'FrontEnd > THREE.js' 카테고리의 다른 글
| 물리공간 구축 (0) | 2023.04.24 |
|---|---|
| 3D Computer Graphics (4) (0) | 2023.04.15 |
| Post Processing (0) | 2023.04.13 |
| Setting (0) | 2023.04.11 |
| 추적하기. (0) | 2023.03.22 |
댓글