将split cubic-bezier外推至1,1

本文介绍了将split cubic-bezier外推至1,1的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我需要帮助解决此处提供的解决方案。

I need help with the solution provided here.

我需要修改它以便返回拆分后，将左侧和权限外推至 1,1 。这是因为如果我不推断，我不能使用返回的split cubic-bezier作为css转换。

I need to modify it so that the returned left and rights are extrapolated to 1,1 after splitting. This is because if I don't extrapolate, I can't use the returned split cubic-bezier as a css transition.

所以这是我做的测试。请帮助，因为真实不符合迈克的方式:(我认为问题是我需要将结果推断为1,1。我不能简单地将值加倍，但我很确定。

So this is the test I did. Please help because real does not match mike way :( I think the issue is I need to extrapolate the result to 1,1. I can't simply double the values though I'm pretty sure.

REAL
- easy-in-out 是 cubic-bezier（.42,0，.58,1），图形上是
- 上半部分是轻松进入，这是 cubic-bezier（.42,0,1,1），图形上是
- seoncd half是 ease-out 这是 cubic-bezier（0,0 ，.58,1）和grpahically是
- REAL
  - ease-in-out is cubic-bezier(.42,0,.58,1) and graphically is http://cubic-bezier.com/#.42,0,.58,1
  - first half is ease-in which is cubic-bezier(.42,0,1,1) and graphically is http://cubic-bezier.com/#.42,0,1,1
  - seoncd half is ease-out which is cubic-bezier(0,0,.58,1) and grpahically is http://cubic-bezier.com/#0,0,.58,1
  - 轻松入住-out 与此点相同
  - 上半部分左边给出 cubic-bezier（0.21,0， 0.355,0.25）并以图形方式
    - 返回代码：左：[0,0,0.21,0,0.355,0.25,0.5,0.5]
    - ease-in-out is same as this is starting point
    - first half, left, is given to be cubic-bezier(0.21, 0, 0.355, 0.25) and graphically is http://cubic-bezier.com/#.21,0,.35,.25
      - code returned: left:[0, 0, 0.21, 0, 0.355, 0.25, 0.5, 0.5]
      - 代码返回右：[0.5,0.5,0.645,0.75,0.79,1,1,1]
      - code returned right:[0.5, 0.5, 0.645, 0.75, 0.79, 1, 1, 1]
      用于获取它的代码迈克的方式是：
      Code used for getting it the Mike way is this:
```
var result = split({
    z: .5,
    x: [0, 0.42, 0.58, 1],
    y: [0, 0, 1, 1]
});
alert(result.toSource());
```
      推荐答案
      请验证这一点假设。（曲线原始终点是0,0,1和）
      bezier曲线的前半部分[0,0，.42,0，.58,1,1,1]不应该是[0,0 .42,0 ，1,1,1,1]
      终点是正确的（在缩放到1,1之后），但你已经失去了连续性。
      Please verify this assumption. (curves original end points are 0,0, and 1,1 in a css timing function)The first half of the bezier curve [0,0, .42,0, .58,1, 1,1] should not be [0,0 .42,0, 1,1, 1,1]The end points are correct (after scaling to 1,1), but you have lost continuity there.
      由麦克的算法返回的值是正确的。
      The values returned by Mike's algorithm is correct.
      用于在解释为什么你的假设可能是错误的。
      Try this visualisation for an explanation on why your assumption might be wrong.
      您用来拆分的算法是一种众所周知的算法de Casteljau算法。该方法可以以非常简单的方式几何表达。查看关于如何在任意点进行拆分的动画可视化。
      The algorithm you are using to split is a well known algorithm called de Casteljau algorithm. This method can be geometrically expressed in a very simple manner. Check out the animated visualisations on how this splitting at any arbitrary point is possible https://en.wikipedia.org/wiki/B%C3%A9zier_curve.
      但是，您可能很快就会尝试正确缩放贝塞尔曲线的分割部分适合单位平方，端点固定为0,0和1,1。这可能你可以很容易地在纸上试试。最简单的方法可能只是线性缩放贝塞尔曲线的控制点，但在大多数情况下你会得到一个压扁的曲线。
      However, You may soon hit an issue trying to correctly scale a split portion of a bezier curve to fit in a unit square, with endpoints fixed at 0,0 and 1,1. This probably you can try out quite easily on paper. The easiest way probably is to just linearly scale the control points of the bezier, you will get a squashed curve in most cases though.
      
      这篇关于将split cubic-bezier外推至1,1的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

Bezier

将split cubic-bezier外推至1,1

问题描述

推荐答案