一、Path概述
IMG_2101.PNG
IMG_2102.PNG
IMG_2103.PNG
IMG_2105.PNG
1.1 Path命令匯總
IMG_2106.PNG
大寫代表絕對位置，小寫代表相對位置
IMG_2109.PNG
IMG_2111.PNG
IMG_2112.PNG
1.2 弧線命令
IMG_2113(20170913-094651).jpg
laf 大角，sf 順時針
IMG_2114.PNG
IMG_2115.PNG
IMG_2116.PNG
IMG_2117.PNG
IMG_2119.PNG
IMG_2120.PNG
IMG_2121.PNG
IMG_2122.PNG
IMG_2123.PNG
IMG_2124.PNG
1.3 貝塞爾曲線
IMG_2125.PNG
1.3.1 一次貝塞爾曲線
IMG_2126.PNG
1.3.2 二次貝塞爾曲線
IMG_2127.PNG
IMG_2128.PNG
1.3.3 三次貝塞爾曲線
IMG_2158.PNG
IMG_2159.PNG
IMG_2160.PNG
IMG_2161.PNG
IMG_2162.PNG
IMG_2164.PNG
1.3.4 四次貝塞爾曲線
IMG_2165.PNG
IMG_2166.PNG
IMG_2167.PNG
IMG_2168.PNG
IMG_2169.PNG
IMG_2170.PNG
1.3.5 貝塞爾曲線匯總
IMG_2171.PNG
1.4 二次貝塞爾曲線命令
Q x1 y1 x y
x1,y1 是控制點1，
x,y 是終點
IMG_2172.PNG
1.5 三次貝塞爾曲線命令
C x1 y1 x2 y2 x y
x1,y1 是控制點1，
x2,y2 是控制點2，
x,y 是終點
IMG_2173.PNG
1.6 貝塞爾曲線演示鏈接 http://graphic.duapp.com/path-editor.html
IMG_2178.PNG
IMG_2180.PNG
IMG_2182.PNG
IMG_2184.PNG
IMG_2185.PNG
IMG_2186.PNG
IMG_2187.PNG
1.7 光滑曲線
二次貝塞爾曲線(Q)，的光滑曲線命令：T
三次貝塞爾曲線(C)，的光滑曲線命令：S
IMG_2188.PNG
如圖：兩條 三次貝塞爾曲線 連接的 光滑曲線。
三次光滑曲線命令： S x2,y2 x,y
x2,y2 是第二條貝塞爾曲線的第二個控制點
x,y 是第二條貝塞爾曲線的終點
IMG_2190.PNG
三次光滑曲線命令： S x2,y2 x,y
第二條貝賽爾曲線的第一個控制點，與第一條的第二個控制點關于第一條終點鏡像。
IMG_2201.PNG
如圖：
M p1 C p2 p3 p4 S p5 p6
光標移動到p1；
畫貝塞爾曲線:p2 p3是控制點, p4是終點；
做平滑曲線:第一個控制點是p3關于p4的鏡像點，p5為第二個控制點，p6為終點。
IMG_2202.PNG
假如第一段不是貝塞爾曲線，那么做: S p7 p8，銜接處將不是平滑曲線。
IMG_2204.PNG
1.8 前面不是貝塞爾曲線的，做二次平滑曲線，將一直是平滑曲線。
M p1 T p2 p3 p4 p5 p6
IMG_2206.PNG
IMG_2207.PNG
回顧與思考
據說求貝塞爾曲線長度，有一個框架提供一個什么算法？
IMG_2208.PNG
