如何用四点绘制曲线

Question

我可以使用bezier路径绘制曲线，但是我没有指定两个控制点，而是指定路径经过它的两个点，如下所示

startPoint为（10,90），终点为（70,70），曲线为（20,50），即峰值点。和（60,100）。请让我知道如何绘制它。

Answer 1

来自维基百科的“Béziercurve”文章：

  

任何4个不同点的任何系列都可以转换为立方贝塞尔曲线，该曲线按顺序遍历所有4个点。给定一些三次Bézier曲线的起点和终点，以及沿该曲线顺序排列的任何另外两个不同点，可以恢复原始Bézier曲线的控制点。[3]

最后是http://people.sc.fsu.edu/~jburkardt/html/bezier_interpolation.html

的链接

Answer 2

您可以使用 UIBezierPath addCurveToPoint:controlPoint1:controlPoint2:方法。

CGPoint startPt, endPt, cPt1, cPt2;
// init points here
UIBezierPath *path = [UIBezierPath bezierPath];
[path moveToPoint:startPt];
[path addCurveToPoint:endPt controlPoint1:cPt1 controlPoint2:cPt2];

Answer 3

假设我们有四个点D0(x0,y0)，D1(x1,y1)，D2(x2,y2)，D2(x3,y3)。我们必须找到通过P0-P1-P2-P3，D0，D1和D2的Bezier三次样条线D3。

显然，

P0 = D0
P3 = D2

然后有无数个Bezier样条曲线通过点D1和点D2通过公式定义

P2 = (D1 - (1-t1)^3 * P0 - t1^3 * P3) / (3*(1-t1)*t1^2) -
     (1-t1) * P1/t1;
P2 = (D2 - (1-t2)^3 * P0 - t2^3 * P3) / (3*(1-t2)*t2^2) -
     (1-t2) * P1/t2;

其中t1是与点D1对应的贝塞尔曲线参数，而t2是D2的对应参数。

解决这个方程组将给我们P1

P1 = t2*(D1 - (1-t1)^3 * P0 - t1^3 * P3) / (3*(1-t1)*t1*(t2-t1)) -
     t1*(D2 - (1-t2)^3 * P0 - t2^3 * P3) / (3*(1-t2)*t2*(t2-t1));

我们仍需要定义t1和t2。只要它们不相等且不等于1，它们的值几乎可以是任何值。一个显而易见的选择是0.25和0.75。

以下是一组随机输入值的结果曲线

然后P1和P2可以用作controlPoint1和controlPoint2 UIBezierPath的addCurveToPoint:controlPoint1:controlPoint2方法。