easings.net icon indicating copy to clipboard operation
easings.net copied to clipboard

easeOutBack math function for 0 is incorrect

Open bcardarella opened this issue 3 years ago • 5 comments

Using the Math function for easeOutBack: https://easings.net/#easeOutBack

function easeOutBack(x: number): number {
  const c1 = 1.70158;
  const c3 = c1 + 1;

  return 1 + c3 * pow(x - 1, 3) + c1 * pow(x - 1, 2);
}

console.log(easeOutBack(0))

results in 2.220446049250313e-16 whereas it should be 0

If the calculation is correct then a simple conditional to return 0 when x === 0 would be necessary.

bcardarella avatar Feb 11 '22 04:02 bcardarella

= 1 + c3 * pow(x - 1, 3) + c1 * pow(x - 1, 2); = 1 + 2.70158 * pow(0 - 1, 3) + 1.70158 * pow(0 - 1, 2); // x = 0 = 1 + 2.70158 * pow( - 1, 3) + 1.70158 * pow( - 1, 2); = 1 + 2.70158 * (-1) + 1.70158 * 1; // we know -1^2 is 1 while -1^3 is -1 still = 1 - 2.70158 + 1.70158 ; = 0

Here is my work for arriving at 0 as output with a 0 input. Seems correct to me.

clickyclick avatar Feb 16 '22 14:02 clickyclick

See in JavaScript: Screen Shot 2022-02-16 at 10 07 21 AM

And in Elixir: Screen Shot 2022-02-16 at 10 08 16 AM

bcardarella avatar Feb 16 '22 15:02 bcardarella

Ah I see, format your output to a certain number of decimal places seems like the proper solution.

https://stackoverflow.com/questions/1458633/how-to-deal-with-floating-point-number-precision-in-javascript

clickyclick avatar Feb 16 '22 18:02 clickyclick

Yes, it is an incredibly small value and I'm sure an argument could be made about managing floating point precision but considering some of the other functions defer to 0 if x === 0 it stands to reason to have something similar here.

bcardarella avatar Feb 16 '22 18:02 bcardarella

Changing c1 to 1.701575 works. Effect should be very minor.

Cleroth avatar Sep 23 '23 08:09 Cleroth