[SVG] 5. path 路徑元素

svg 可以使用 path 標籤,來畫出你想要的路徑,非常的方便,讓我們來看一個基本的使用方式,瞭解幾個基本的指令,來畫出路徑,並指令畫的顏色、填滿、粗細。

使用方法

d 是一個屬性名稱,表示的是方向指令(directions commands),用來設定你想要的路徑參數,這裡介紹 MLHVZ。另有 A、Q,後續另開篇文章做介紹。

  • M:表示移動(Move),可接受一個 x y 軸的座標。
  • L:表示畫直線(Line),可接受一個 x y 軸的座標。
  • H:表示畫水平線(Horizontal Line),可接受一個 x 軸的座標。
  • V:表示畫垂直線(Vertical Line),可接受一個 y 軸的座標。
  • Z:表示畫直線回原先最一開始的點,形式封閉(Close Path)。

範例

您可在此處留言

avatar

這個網站採用 Akismet 服務減少垃圾留言。進一步瞭解 Akismet 如何處理網站訪客的留言資料

  Subscribe  
Notify of