3
$\begingroup$

I'm developing an iPhone app that allows users to cut out part of an image from its background. In order to do this, they'll connect a bunch of bezier curves together to form the clipping path. Rather than have them move the control points of the curves in order to change the curve, I'd like them to be able to move a point on the curve itself. At this point, I'm not set on using quadratic rather than cubic beziers, or vice versa. The rest of this post will discuss the issue from the point of view of quadratic curves, but I would love an answer that provides solutions to both.

It seems to me that there are two possible methods for accomplishing this:

  1. By determining the relationship between the point on the curve and the true control point. If this can be done, then the new location of the control point can be calculated based on the new location of the point on the curve.

  2. By using an equation that can estimate a bezier curve based on two end points and a third point on the curve (if cubic, then a third and fourth point on the curve).

Are either of these possible? I've been googling this for a while and have come across a couple potential solutions using method #2, but I don't fully understand either:

Solution 1 (click here): I think I understand the code in this example well enough, but I don't know how to calculate t.

Solution 2 (click here): This code is written in C#. I tried converting it to Objective-C (the language used for iPhone apps), but ultimately got stuck on the "solvexy()" function because I don't see how i or j are used after calculating their values.

In regards to method #1, it seems to me that there should be some mathematical relationship between the control point, and the point on the curve through which a tangent to the curve at that point would be perpendicular to a line drawn from the control point to that point.

Here are a couple illustrations: quadratic, cubic.

The idea is that this point which lies on the curve, through which the perpendicular tangent is drawn, is the point that users would be dragging in order to modify the curve.

  • 0
    Solution 1: $t$ looks like the parameter along the curve, with $t\in[0,1]$, I'd say. Solution 2: `i` and `j` are output parameters; they get assigned to the corresponding argument in the caller; in this case first `x1`, `x2`, then `y1`, `y2`. You might want to take a look at the sidebar to the right; there are lots of answers to similar questions there; e.g. http://math.stackexchange.com/questions/5166/algorithm-to-calculate-the-control-points-of-a-cubic-bezier-curve, http://math.stackexchange.com/questions/42395/find-control-point-on-piecewise-quadratic-bezier-curve.2011-07-26
  • 0
    Thanks for the clarification in the C# code. I'll give it another try with that info. And I did read those two questions you linked to. The first one's answer is that a Bezier should not be used, but rather a parametric spline. So I spent a while looking into how to create a parametric spline (as well as what one is in the first place) in objective-c, but couldn't come up with anything. In the second post you link to it seems that the OP is asking about how to create a Bezier simply from two end points, but I will know at least one other point that the curve must pass through.2011-07-26
  • 0
    Approach 2 is underspecified. Given $P(0)$, $P(1)$, $P(t)$, and $t\in(0,1)$ you have a unique quadratic Bézier curve and can find the non-interpolated control point using the Bernstein polynomials, but you're not specifying $t$. I suspect you could specify two interpolated points and get a unique quadratic Bézier curve, but I haven't worked through the details.2011-07-26
  • 0
    Someone should have inserted the linked illustrations into the question before FreeImageHosting deleted them... (Using the StackExchange "insert image" button uploads the images to Imgur, which SE has a partnership with, so the images will stay up as long as SE does.)2014-05-25
  • 0
    There is an algorithm for this in Tiller's NURBS book. Chapter 11.5.1 I have implemented this. It did what it was supposed to do, but I didn't use it a lot.2017-08-30

4 Answers 4