首先介紹以下什么是貝塞爾曲線
貝塞爾曲線又叫貝茨曲線（Bezier），由兩個端點以及若干個控制點組成，只有兩個端點在曲線上，控制點不在曲線上，只是控制曲線的走向。
控制點個數為0時，它是一條直線;
![線性貝塞爾曲線演示動畫，t在[0,1]區間](/image/aHR0cHM6Ly91cGxvYWQud2lraW1lZGlhLm9yZy93aWtpcGVkaWEvY29tbW9ucy90aHVtYi8wLzAwL0IlQzMlQTl6aWVyXzFfYmlnLmdpZi8yNDBweC1CJUMzJUE5emllcl8xX2JpZy5naWY=.png)
控制點個數為1時，它是二次貝塞爾曲線;
![二次貝塞爾曲線演示動畫，t in [0,1]](/image/aHR0cHM6Ly91cGxvYWQud2lraW1lZGlhLm9yZy93aWtpcGVkaWEvY29tbW9ucy90aHVtYi8zLzNkL0IlQzMlQTl6aWVyXzJfYmlnLmdpZi8yNDBweC1CJUMzJUE5emllcl8yX2JpZy5naWY=.png)
控制點個數為2時，它是三次貝塞爾曲線；
![三次貝塞爾曲線演示動畫，t in [0,1]](/image/aHR0cHM6Ly91cGxvYWQud2lraW1lZGlhLm9yZy93aWtpcGVkaWEvY29tbW9ucy90aHVtYi9kL2RiL0IlQzMlQTl6aWVyXzNfYmlnLmdpZi8yNDBweC1CJUMzJUE5emllcl8zX2JpZy5naWY=.png)
....
數學公式
二次貝塞爾曲線
![{\mathbf {B}}(t)=(1-t)^{{2}}{\mathbf {P}}_{0}+2t(1-t){\mathbf {P}}_{1}+t^{{2}}{\mathbf {P}}_{2}{\mbox{ , }}t\in [0,1]](/image/aHR0cHM6Ly93aWtpbWVkaWEub3JnL2FwaS9yZXN0X3YxL21lZGlhL21hdGgvcmVuZGVyL3N2Zy9kMjhlZDAzNDc1MTA2NTY0ZDRhOTU5NjQ3YWNiMmI3ZmEzNDkzNWVm.png)
p0,p2是起始點，p1是控制點
分別把p0,p1,p2點的x,y坐標帶入，求出曲線上的點的x,y坐標
三次貝塞爾曲線
![{\mathbf {B}}(t)={\mathbf {P}}_{0}(1-t)^{3}+3{\mathbf {P}}_{1}t(1-t)^{2}+3{\mathbf {P}}_{2}t^{2}(1-t)+{\mathbf {P}}_{3}t^{3}{\mbox{ , }}t\in [0,1]](/image/aHR0cHM6Ly93aWtpbWVkaWEub3JnL2FwaS9yZXN0X3YxL21lZGlhL21hdGgvcmVuZGVyL3N2Zy82NzFmNjUxNzU3YzJlN2VmYjQ4ZGE1ODAxZTgzNWQzY2FmZTRlZWJh.png)
p0,p3是起始點，p1,p2是控制點
svg的path中與貝塞爾曲線相關的命令有：
C(curveto):三次貝塞爾曲線，參數：
x1,y1 x2,y2 m,n
x1,y1 x2,y2為兩個控制點的xy坐標，m n為終點的坐標，起始點為執行該命令之前，筆觸的位置。（注：svg中的曲線命令通常與M命令一起使用）
S(smooth curveto)參數：
x2,y2 m,n
x2,y2為第二個控制點，m n為終點的坐標,對於第一個控制點分為兩種情況：
當S命令的前一個命令是C或S命令時，第一個控制點是前一個C或S的控制點的對稱點（關於前一個命令的終點或當前命令的起始點）；
否則S命令將退化為二次貝塞爾曲線（同Q）。
Q(quadratic Belzier c
urve)二次貝塞爾曲線，參數：
x1,y1 m,n
x1,y1為控制點坐標，m,n為終點坐標。
T(smooth quadratic Belzier curveto)
參數：m,n
同S相似，T是Q的退化或者懶人寫法。分為兩種情況：
當T的前一個命令是Q或T時，控制點是前一個Q或T的控制點的對稱點（關於前一個命令的終點或當前命令的起始點）；否則T命令將退化為一條直線。
相對坐標
c,s,q,t命令的相對位移相對的是同一個點，
以c命令為例，當pen表示當前筆觸的位置時，
點的絕對坐標為：
x1=pen[0]+dx1
y1=pen[1]+dy1
x2=pen[0]+dx2
y2=pen[1]+dy2
m=pen[0]+mx
n=pen[1]+my
參考：https://zh.wikipedia.org/zh-cn/%E8%B2%9D%E8%8C%B2%E6%9B%B2%E7%B7%9A
http://www.zhangxinxu.com/wordpress/2014/06/deep-understand-svg-path-bezier-curves-command/