javascript - 与 ease cubic-bezier 函数相反

Question

我有 ease cubic-bezier 函数:cubic-bezier(.25,.1,.25,1) ( http://cubic-bezier.com/#.25,.1,.25,1 )

我想要相反的东西。这是我要完成的工作的图形表示:

左边的图是我有的，右边图的功能是我要实现的。

Answer 1

如果您想像更新后的答案那样进行轮换，我们所要做的就是......嗯，那个。围绕 (0.5,0.5) 旋转 180 度或 π 弧度 Angular 。假设我们有一条编码为数组 c 的曲线，其中包含四个点对象 { x:..., y... }，那么我们可以按以下方式实现此旋转:

c = [ {x:...,y:...}, ..., ..., ...];

function halfUnitTurn(v) {
  // Note: it's actually 0.5 + ((v.x-0.5)*cos(pi) - (v.x-0.5)*sin(pi)),
  // (and x*sin + y*cos for the y:... part) but: cos(pi) is just -1, and
  // sin(pi) is 0, so things REALLY simplify!
  return {
    x: 0.5 - (v.x-0.5),
    y: 0.5 - (v.y-0.5)
  };
}

var rotated = c.map(function(p) { return halfUnitTurn(p); });

作为演示代码:http://jsfiddle.net/mokg77fq/