使用四段三次 Bézier 曲线拟合圆
2024-3-20
| 2024-9-2
0  |  Read Time 0 min
type
status
date
slug
summary
tags
category
icon
password

效果预览

notion image
 
notion image
 
 
 

使用四段三次贝塞尔曲线拟合圆

认识贝塞尔曲线

数学数值分析领域中,贝塞尔曲线(英语:Bézier curve)是计算机图形学中相当重要的参数曲线(贝塞尔曲线通常用于生成平滑曲线,因为它们的计算成本较低并且可以产生高质量的结果)
贝塞尔曲线于1962年,由法国工程师皮埃尔·贝兹(Pierre Bézier)所广泛发表,他运用贝塞尔曲线来为汽车的主体进行设计。贝塞尔曲线最初由保尔·德·卡斯特里奥于1959年运用德卡斯特里奥算法开发,以稳定数值的方法求出贝塞尔曲线。
 

三次贝塞尔曲线

P0、P1、P2、P3四个点在平面或在三维空间中定义了三次贝塞尔曲线。曲线起始于P0走向P1,并从P2的方向来到P3。一般不会经过P1或P2;这两个点只是在那里提供方向信息。P0和P1之间的间距,决定了曲线在转而趋进P2之前,走向P1方向的“长度有多长”。
 
曲线的参数形式为:
 
notion image
notion image
对于三次曲线,可由线性贝塞尔曲线描述的中介点Q0、Q1、Q2,和由二次曲线描述的点R0、R1所建构:
三次贝塞尔曲线的结构三次贝塞尔曲线演示动画,t在[0,1]区间
notion image
notion image
 

使用贝塞尔曲线拟合圆

思路:近似圆的标准方法是将其分成四个相等的部分,并用三次贝塞尔曲线替换每个直角圆弧。
在 Android 中,可以使用绘图库 Canvas 来绘制贝塞尔曲线,Canvas 提供 cubicTo 函数来构建一段三次 Bezier 曲线。
  1. 通过一段三次贝塞尔曲线,拟合 1/4 圆
  1. 使用四段三次贝塞尔曲线,拟合圆
 

魔法数值 C

对三次贝塞尔曲线拟合圆弧,一个关键的因素,魔数数值 C 的计算,开始之前,我们先观察不同 C 对应的三次贝塞尔曲线与圆弧的比较,如下图所示,根据贝塞尔曲线的对称性,图中蓝色斜线上的点对应三次贝塞尔曲线参数方程中的 t=0.5。当蓝色斜线、圆弧、贝塞尔曲线上的点三者重叠时的 C 即是拟合圆弧最佳魔法数值。
notion image
 
 
针对三次贝塞尔曲线拟合圆弧进行通用公式的求解,如下图所示
notion image
P1,P4 为锚点,P2,P3 为控制点。通过圆心 O 作一段圆弧 P1P4,P1P2,P4P3 为切线并且 P1P2=P4P3=C,E 点为圆弧 P1P4 的中点,这样,以 P1、P2、P3 和 P4 作为三次贝塞尔曲线的控制点,求得使曲线的中点经过 E 时,对应的 C 值。
根据贝塞尔曲线的知识,我们知道三次贝塞尔曲线的参数方程如下,其中P1、P2、P3、P4为四个控制点坐标,B(t)表示曲线上的每一点。
notion image
根据贝塞尔曲线的对称性,可以知道 E 点位于 B(0.5)处,代入公式可以得到:
B(0.5)=(1/8)·P1+(3/8)·P2+(3/8)·P3+(1/8)·P4
根据三角函数的性质,带入P1、P2、P3、P4 可以求得:
C=(4/3)·(1−𝑐𝑜𝑠(𝜃/2))/𝑠𝑖𝑛(𝜃/2)
这样就求出了使用三次贝塞尔曲线拟合圆弧的一般性公式。
我们要拟合 1/4 圆弧,也就是说在 θ=π/2 时,可以计算出该 C 值为 0.551915024494

参考文档

 
  • Bezier
  • 我用 Bézier 曲线创造了一个机器人Router 原理
    • Utterance
    Catalog