텍스트 코딩내장 모듈TWEEN트윈 easing 함수 소개

트윈 easing 함수 소개

트윈 easing 함수의 다양한 보간 방정식에 대한 정보를 제공합니다.


.easing()을 통해 시작값과 타겟값 사이를 보간할 방정식을 변경할 수 있습니다.
기본값은 TWEEN.Easing.Linear.None입니다. 아래는 사용 예시입니다.

const startPosition = new THREE.Vector3();
const endPosition = new THREE.Vector3(1, 0, 0);
 
const tween = new TWEEN.Tween(startPosition);
tween.to(endPosition);
tween.easing(TWEEN.Easing.Quadratic.In);
tween.start();

tween-easing_graph 트윈 easing 보간 방정식 그래프

아래에 제공된 카드를 통해 다양한 종류의 보간 방정식을 그래프로 확인해볼 수 있습니다.


트윈 easing 보간 방정식 그래프

추가로 아래의 월드를 통해 각각의 보간 방정식을 적용하면 어떤 움직임이 나타나는지 확인 할 수 있습니다. 그래프 오브젝트를 누르면 구 오브젝트가 움직입니다.


tween-easing_world TWEEN 월드