許多字母命令(例如：M m）（但不是全部）成對。有一個大寫和一個小寫版本。大寫版本是絕對版本，小寫是相對版本。讓我們繼續以M為例：
M 100,100意思是“拿起筆並將其移動到確切的坐標100,100”m 100,100的意思是“將筆100向下移動100和從你現在的任何地方向右移動100”。- 大小字母絕對坐標，小寫字母相對坐標
許多命令具有相同的設置。“筆”當前位置的小寫版本因素。【每一個點 2個值, 負數向反方向走】
| Mx，y | 移動到絕對坐標x，y |
| mx，y | 向右移動x並向下移動y（如果為負值，則向左移動並向上移動） |
| Lx，y | 繪制一條直線到絕對坐標x，y |
| lx，y | 繪制一條直線，指向相對正確的x和向下y的點（或者如果為負值，則向上並向上） |
| Hx | 水平畫一條直線到確切的坐標x |
| hx | 相對於右側x水平繪制一條線（如果為負值，則向左側繪制一條線） |
| Vy | 垂直繪制一條直線到確切的坐標y |
| vy | 垂直相對向下畫一條線（如果是負值，則向上畫一條線） |
| Z（或z） | 畫一條直線回到路徑的開始處（從當前位置到起點畫一條直線閉合） |
C命令需要三點。前兩個點定義了兩個貝塞爾曲線手柄的位置，三點中的最后一點是曲線的終點。
S（或s）命令是與C類似命令，它需要2個，因為它假設第一貝塞爾點是從最后一個S或C命令的最后一個Bezier點的反映。（右）
1.如果S命令跟在一個C命令或者另一個S命令的后面，它的第一個控制點，就會被假設成前一個控制點的對稱點。
2.如果S命令單獨使用，前面沒有C命令或者另一個S命令，那么它的兩個控制點就會被假設為同一個點。
Q命令它需要兩個點。它想要的貝塞爾點是一個“二次曲線”控制點。就好像它的起點和終點在控制句柄結束的地方共享一個點。(左）
T命令Q命令的簡寫命令。與S命令相似，T也會通過前一個控制點，推斷出一個新的控制點。
1.T命令前面必須是一個Q命令，或者是另一個T命令。
2.如果T單獨使用，那么控制點就會被認為和終點是同一個點，所以畫出來的將是一條直線。
A命令可能是最復雜的，或者至少需要最多的數據。你可以給它定義一個橢圓的寬度，高度，橢圓旋轉方式以及終點的信息。允許不閉合。可以想像成是橢圓的某一段，共七個參數。
參數：rx,ry x-axis-rotation large-arc-flag sweep-flag x,y
RX,RY指所在橢圓的半軸大小（ 弧的半長軸長度， 弧的半短軸長度）
XROTATION指橢圓的X軸與水平方向順時針方向夾角，可以想像成一個水平的橢圓繞中心點順時針旋轉XROTATION的角度（是此段弧所在的x軸與水平方向的夾角，即x軸的逆時針旋轉角度，負數代表順時針旋轉角度）。
FLAG1只有兩個值，1表示大角度弧線，0為小角度弧線。
FLAG2只有兩個值，確定從起點至終點的方向，1為順時針，0為逆時針
X,Y為終點坐標； 這個2個覺得着橢圓的大小
然后獲得更多有關沿着該橢圓的哪條路徑的信息，您希望獲得該路徑：
有兩個可能的路徑橢圓和兩個不同的橢圓路徑，給出四條可能的路徑。
第一個參數是大弧標志。它只是確定弧線是否應該大於或小於180度; 最后，這個標志決定弧線將圍繞給定的圓周運行的方向。
第二個參數是掃描標志。它確定弧線是否應該開始以負角度或正角度移動，這基本上會選擇您將要繞行的兩個圓圈中的哪一個。
| CcX1，cY1 cX2，cY2 eX，eY | 繪制基於兩個貝塞爾控制點的貝塞爾曲線，並在指定坐標處結束 |
| C | 與所有相對值相同 |
| ScX2，cY2 eX，eY | 基本上，假定第一個貝塞爾控制點的C命令是前一個S或C命令中最后一個貝塞爾點的反映 |
| s | 與所有相對值相同 |
| QcX，cY eX，eY | 根據單個貝塞爾控制點繪制貝塞爾曲線，並在指定坐標處結束 |
| q | 與所有相對值相同 |
| TeX，eY | 基本上，假設第一個貝塞爾控制點的Q命令是前一個Q或T命令中使用的最后一個貝塞爾點的反映 |
| t | 與所有相對值相同 |
| ARX，RY旋轉，弧，掃，EX，EY | 繪制一條基於橢圓形曲線的弧線。首先定義橢圓的寬度和高度。然后是橢圓形的旋轉。隨着終點，這使得兩個可能的橢圓。所以弧和掃描是0或1，並確定哪個橢圓和哪條路徑。 |
| a | 與eX，eY的相對值相同 |
M = moveto(M X,Y) ：將畫筆移動到指定的坐標位置
L = lineto(L X,Y) ：畫直線到指定的坐標位置
H = horizontal lineto(H X)：畫水平線到指定的X坐標位置
V = vertical lineto(V Y)：畫垂直線到指定的Y坐標位置
C = curveto(C X1,Y1,X2,Y2,ENDX,ENDY)：三次貝賽曲線
S = smooth curveto(S X2,Y2,ENDX,ENDY)
Q = quadratic Belzier curve(Q X,Y,ENDX,ENDY)：二次貝賽曲線
T = smooth quadratic Belzier curveto(T ENDX,ENDY)：映射
A = elliptical Arc(A RX,RY,XROTATION,FLAG1,FLAG2,X,Y)：弧線
Z = closepath()：關閉路徑
svg 說明使用：https://css-tricks.com/svg-path-syntax-illustrated-guide/ #英語不好，可以谷歌瀏覽器打開
https://www.sitepoint.com/closer-look-svg-path-data/
svg 其他一些生成路徑地址：https://juejin.im/entry/59b5e629f265da065f047ad6