Search code examples
fluttermathgraphgraphicsbezier

Find control point on Quadratic Bezier Curve

I drew a Quadratic Bezier curve. Here A(0, 1.39) and B(30, 1.42) are two points and curves drawn with a single control point (15.02, 6.07). Quadratic Bezier

I want to move point B along the curve. But When I move the curve shape changes. So I want to move the control point also with respect to point B.

Pic: Point moved but not control point moved so curve disoriented. Curve Distorted by Moving B Point

Pic: Point and Control point moved, so the curve is in proper shape. CP is also moved

The blue shape is for reference. Kindly help me to find the control point on moving point B.

Solution

  • You need to subdivide curve onto two new smaller curves. To calculate control point of "left" new curve, when you subdivide large curve at parameter t (in range 0..1):

    left_P[1] = large_P[0] * (1-t) + large_P[1] * t

    All points of left curve:

    left_P[0] = large_P[0]   //initial point
left_P[1] = large_P[0] * (1-t) + large_P[1] * t   //control point
left_P[2] = large_P[0] * (1-t)^2 + 2*large_P[1] * t*(1-t) + large_P[2] * t^2   //last point, coincides with your moving point

    For your example t is about 0.7, and

    new_C = 0.3*A + 0.7*C