I have this graph: graph without tension
I'm using linearGradient to color the areas between the lines. I'm calculating the cutting point's x, and then calculating the offset for where I want to stop the previous color and start the new one (it will be that x)
When setting tension to be 0, (which means straight lines) the graph gets colored as expected. Problem is, that when I set tension to be 0.5 I get the following result: graph with tension The reason for that is that the tension is calculated by Bezier Curve, which changes the equation I use to calculate the cutting point (the original points have changed).
The question is, how do I calculate the points coordinates after the tension?
As I understand it, you just need to find the $x$ values at the points where the two "tensioned" curves intersect each other. So, suppose the curves are $y=f(x)$ and $y=g(x)$, we want to find the $x$ value(s) at which $f(x)=g(x)$, i.e. $f(x) - g(x)=0$.
But both $f$ and $g$ are cubic functions, so $f-g$ is also cubic. So, you need to find the zero(s) of a cubic polynomial. You can do this either with a formula, or with numerical methods. You can start reading here.