왜이 easeOutCubic은 시작 부분에서 큰 점프를 반환하고 끝에서 작게 나타 납니까?

Question

나는이 easing 함수를 잘못 사용하고 있다고 생각한다. 완화 기능을 사용하면 더 큰 변경 사항을 시작으로 되돌릴 수 있지만 끝까지 갈수록 점프가 커집니다.

//Current value = Change 
25 = 0 
27.227575000000005 = 2.227575000000005 
31.63817500000001 = 4.410600000000006 
38.187700000000014 = 6.549525000000003 
46.83250000000002 = 8.644800000000004 
57.52937500000003 = 10.696875000000013 
70.23557500000004 = 12.70620000000001 
84.90880000000004 = 14.673225000000002 
101.50720000000004 = 16.598399999999998 

무엇이 잘못 되었나요?

내가 원하는 무엇 :

1. 그것은 25에서 시작한다 (25 %,하지만 난 25 정수를 사용)
2. 그것은 100 끝나야합니다 (그것은 내가 '으로 이상가는 것이 괜찮습니다 100 최대로 제한하는 것이다)
3. 이 빨리 시작해야하고 느린

https://jsfiddle.net/pqLddvzo/1/

,536 종료

function easeOutCubic(t, b, c, d) { 
    t /= d; 
    t--; 
    return c*(t*t*t + 1) + b; 
} 

var x = 25; 
var i = 0; 
while (x < 100 && i < 500) 
{ 
    let last = x; 

    //Calculate our new percentage 
    x = easeOutCubic(i, x, 75, 100) 

    //The new value and the change in value 
    console.log(x + " = " + (x - last)); 

    //move to next step 
    i++; 
} 

//Also, why doesn't it take the full number of steps? 
console.log(i); 

Answer 1

문제는 내가 다음 호출로 반환 된 값을 전달했다는 것입니다. 은 "원래"값 :

x = easeOutCubic(i, x, 75, 100); 

대신이 있어야한다 :

x = easeOutCubic(i, 25, 75, 100) 

그 필드는 변경되지 않은 상태로 유지해야합니다. 각 호출에서 첫 번째 매개 변수 만 변경해야합니다.

Answer 2

당신은 아마 당신은을 적용하여 가파른 곡선을 만들 수 있습니다 만 (25) Math.sqrt()

첫 5, 50 단위를 구성하는 방법

// Given a scale function that accepts whatever and return a number between 0 and 1 
 
// Returns a function that accepts the same whatever and returns a number between min and max 
 
function mapScale(scale, min, max) { 
 
    return (...args) => { 
 
    const original = scale(...args); 
 
    return min + (original * (max - min)); 
 
    }; 
 
} 
 

 
// Accepts a number between 0 and 1 
 
// Returns a mapped number between 0 and 1 
 
function sqrtScale(n) { 
 
    n = Math.min(1, Math.max(n, 0)); // stay within the borders of 0 and 1 
 
    return Math.sqrt(n); 
 
} 
 

 
const sqrtScaleBetween25And100 = mapScale(sqrtScale, 25, 100); 
 

 
for (let i = 0; i < 1; i = i + .1) { 
 
    console.log(sqrtScaleBetween25And100(i)); 
 
}

주와 지난 5 뭔가를 원하는 예를 들어, n ** (1/3) 또는 이벤트 Math.sqrt(Math.sqrt(n))