Bezier Curve - Using (Graph)X to Solve Y

Question

I am trying to take two points and two tangents and solve for y given x. However, all the resources I have found online for doing so online are a bit different than what I need. All of the resources have allowed me to find x and y given a percentage between 0 and 1. That is not what I need. I will try to explain what I mean with the picture below:

I know this curve is multiple bezier lines, but I am just trying to make a point. It is a bit easier to demonstrate on a very curvy line. If I try to get the y output for a percentage of .5 on formulas I have found online I will got (probably) approximately the red point. This is not what I want. I want to solve for .5 on the graph, and not use the percentage of the graph. I want to solve for the blue line. Does anyone know how I can accomplish this? Also, if I make a loop with the lines, is it possible to find both y values?

If anyone is kind enough to write me a small sample, I am using C#, and the variables: Vector2 start, tan1, end, tan2;//Each contain x and y float float time;//the time on the graph we want to solve for (between 0 and 1)

        Vector2 start = new Vector2(50, 150), end = new Vector2(150, 150), tan1 = new Vector2(65, 30), tan2 = new Vector2(90, 160), delta;
    float t = .5f;
    delta = end - start;
    GLDraw.DrawBezier(start, tan1, end, tan2, Color.red, 1);
    GLDraw.DrawBox(new Rect(tan1.x - 1, tan1.y - 1, 2, 2), Color.red, 1);
    GLDraw.DrawBox(new Rect(tan2.x - 1, tan2.y - 1, 2, 2), Color.red, 1);
    float X = Mathf.Pow((1 - t), 3) * start.x + 3 * Mathf.Pow((1 - t), 2) * t * tan1.x + 3 * (1 - t) * Mathf.Pow(t, 2) * tan2.x + Mathf.Pow(t, 3) * end.x;
    float Y = Mathf.Pow((1 - t), 3) * start.y + 3 * Mathf.Pow((1 - t), 3) * t * tan1.y + 3 * (1 - t) * Mathf.Pow(t, 2) * tan2.y + Mathf.Pow(t, 3) * end.y;
    GLDraw.DrawBox(new Rect(X - 1, Y - 1, 2, 2), Color.red, 1);

[ drawnCurve[2]

specifically what kind of problems are you running into with the code. we aren't a code writing service. — Daniel A. White, Aug 15 '17 at 11:43
You can't solve bezier curves for a specific `x`-value as they are not classic function graphs. You may define a single bezier curve that has 3 solutions for the same `x`. You can, however, intersect the curve with a vertical line starting at `(x, 0)` and retreive all possible intersections. — Psi, Aug 15 '17 at 11:45
The problem is that I don't know the math required to pull off such a task. But I am using Unity and I am not directly creating the Bezier Curve, I am using a function I have not written. I will paste the code as an edit above momentarily. — TheNoobieWaffle, Aug 15 '17 at 11:53
As you can see above now, the calculated point does not have a x value equivalent to the centerpoint between the start and end point. I am trying to solve for y there. The point I get is halfway through the drawn line. — TheNoobieWaffle, Aug 15 '17 at 12:01

MBo · Answer 1 · 2017-08-15T12:46:16.130

You have equation for unknown t and given XValue. Just open the brackets and solve resulting cubic equation for t. Note that equation might have upto three solutions.

 (1 - t)^3 * start.x + 
 3 * (1 - t)^2 * t * tan1.x + 
 3 * (1 - t) * t^2 * tan2.x + 
 t^3 * end.x - XValue               =  0

 t^3 * (-start.x + 3 * tan1.x - 3 * tan2.x +  end.x)  + 
 t^2 * (3*start.x - 6 * tan1.x + 3 * tan2.x) + 
 t   * (-3*start.x + 3 * tan1.x) + 
       (start.x - XValue)           =  0

Bezier Curve - Using (Graph)X to Solve Y

1 Answers1