Does the d3.js function have the ability to reverse simplicity?

Question

With d3.js we can achieve weakened time from normalized time t, usually in the range [0,1]

For instance:

d3.easeCubic(0.25) = 0.0625

How can we reverse this, how can we find x given by known y?

d3.easeCubic(X) = 0.0625,
X ???

The answer here is the cubic root, but still.

The problem is reuse, the lightness function can change to d3.easeExpIn, or `d3.easeCircleOut, or whatever, do you need to create inverse functions yourself or are they hidden somewhere?

Answer 1

First, your math is wrong. d3.easeCubic(0.25)will provide you with 0.0625:

var easy = d3.easeCubic(0.25);
console.log(easy);

<script src="https://d3js.org/d3.v4.min.js"></script>

Run codeHide result

Now back to your question:

How can we reverse this, how can we find x given by known y?

, , X, Y. , , , ... , about d3.easeCubic, d3.easeCubicInOut, .

, :

export function cubicInOut(t) {
    return ((t *= 2) <= 1 ? t * t * t : (t -= 2) * t * t + 2) / 2;
}

, , , :

function cubicInOut(t) {
    return ((t *= 2) <= 1 ? t * t * t : (t -= 2) * t * t + 2) / 2;
}

console.log(cubicInOut(0.25))

Hide result

.

, 1, :

function inverseEaseCubic(t){
    return Math.cbrt(t * 2) / 2;
}

. 0.0625 , 0.25:

function inverseEaseCubic(t){
    return Math.cbrt(t * 2) / 2;
}

console.log(inverseEaseCubic(0.0625))

Hide result

1, :

function InverseEaseCubic(t){
    return t <= 1 ? Math.cbrt(t * 2) / 2 : (Math.cbrt(2 * t - 2) + 2) / 2;
}

PS: , @altocumulus , . . , :

function exponentiation(a){
    return a*a;
}

, 4. ? ? , , , 2 :

console.log(exponentiation(2))//returns 4
console.log(exponentiation(-2))//also returns 4 

Answer 2

@Gerardo Furtado, ,

function cubicInOut(t) {
  return ((t *= 2) <= 1 ? t * t * t : (t -= 2) * t * t + 2) / 2;
}
function inverseEaseCubic(x) {
  return x < .5 ? Math.cbrt(x / 4) : (2 - Math.cbrt(2 - 2 * x)) / 2;
}
  
console.log(inverseEaseCubic(cubicInOut(1)) === 1);
console.log(inverseEaseCubic(cubicInOut(0.6)) === 0.6);
console.log(inverseEaseCubic(cubicInOut(0.4)) === 0.4);
console.log(inverseEaseCubic(cubicInOut(0.1)) === 0.1);
console.log(inverseEaseCubic(cubicInOut(0)) === 0);

Hide result