Re: [csswg-drafts] [css-easing-2] Complex easing/timing functions (#229)

Missing _m<sub>n</sub>_ values (slopes) can be worked out by solving a system of linear equations with an equation per knot. Which equation to use for each knot depends on the knot's situation.

**The slope is already known (obvious)**

 m<sub>n</sub> = the slope

Otherwise, assuming:

 &Delta;t<sub>n</sub> = t<sub>n+1</sub> - t<sub>n</sub>
 &Delta;p<sub>n</sub> = p<sub>n+1</sub> - p<sub>n</sub>

**Slope unknown, neighboring knots have different _t_**:

 m<sub>n-1</sub> / &Delta;t<sub>n-1</sub> + 2 * m<sub>n</sub> * (1 / &Delta;t<sub>n-1</sub> + 1 / &Delta;t<sub>n</sub>) + m<sub>n+1</sub> / &Delta;t<sub>n</sub> = 3 * (&Delta;p<sub>n-1</sub> / &Delta;t<sub>n-1</sub><sup>2</sup> + &Delta;p<sub>n</sub> / &Delta;<sub>n</sub><sup>2</sup>)

**Slope unknown, all neighboring knots have the same _t_, or sole knot**:

 m<sub>n</sub> = 0

**Slope unknown, only following knot has different _t_**:

 2 * m<sub>n</sub> / &Delta;t<sub>n</sub> + m<sub>n+1</sub> / &Delta;t<sub>n</sub> = 3 * &Delta;p<sub>n</sub> / &Delta;t<sub>n</sub><sup>2</sup>

**Slope unknown, only preceding knot has different _t_**:

 m<sub>n-1</sub> / &Delta;t<sub>n-1</sub> + 2 * m<sub>n</sub> / &Delta;t<sub>n-1</sub> = 3 * &Delta;p<sub>n-1</sub> / &Delta;t<sub>n-1</sub><sup>2</sup>

This choice of equations amounts to doing standard [spline interpolation](https://en.wikipedia.org/wiki/Spline_interpolation) for each unbroken section of curve with unknown slopes.

The [tridiagonal matrix algorithm](https://en.wikipedia.org/wiki/Tridiagonal_matrix_algorithm) is a good fit for solving the resulting system of equations and is easy to implement.

-- 
GitHub Notification of comment by visiblecode
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/229#issuecomment-499769928 using your GitHub account

Received on Friday, 7 June 2019 06:13:35 UTC