系列文章
Day1 - 初探 SVG
第一次參加鐵人賽真是緊張，在很多想寫的主題下，選擇了 SVG，主要除了瀏覽器已經都開始支援，更重要的是自己對圖形與設計的愛，對於視覺設計師而言，向量繪圖和基礎動...
Day2 - SVG Layer
許多的設計師談到向量繪圖，總是相當的興奮，但只要一提到向量繪圖裡的程式碼，馬上就暈頭轉向不知所云，這篇將要以 Illustrator 做為輔助工具出發，帶領大家...
Day3 - SVG 基本形狀
通常我們在學習向量圖，第一個一定是學基本形狀，基本形狀不外乎這幾個：矩形、圓角矩形、圓形、橢圓、多邊形，因此 SVG 的基本形狀也從這幾個出發，當然，如果會使用...
Day4 - SVG Path 基礎篇
接下來要談談 SVG 裡頭最為重要的元素：Path，因為SVG 是向量圖，所有的物件和元素都是由 Path ( 路徑 ) 所組成，所以 Path 就具有相當多的...
Day5 - SVG Path 進階篇
上一篇 看完了 Path 大部分的指令，這一篇就要介紹 Path 最困難的 A 指令。( oxxostudio.tw 同步發表： SVG 研究之路 (5) -...
Day6 - SVG stroke 邊框
前面的章節都在介紹繪製形狀，而我都是使用單純的線條來描繪形狀的邊框，因此這篇就來聊聊 stroke ( 邊框 ) 的設定。( oxxostudio.tw 同步發...
Day7 - SVG Stroke-miterlimit
在之前 SVG 研究之路 (6) - stroke 邊框 有介紹過邊框的用法，不過其實 Stroke 還有其他的屬性可以設定使用，以下將介紹：「stroke-...
Day8 - SVG Stroke-marker
在前兩篇都有介紹了 stroke 的用法，其實 stroke 還有另外一個特別的功能可以設定，就是「marker」，顧名思義，就是在線段的起點、中間點或結束點，...
Day9 - 理解 SVG viewport 與 viewbox
前一天的文章裡有提到 viewbox ，但是總覺得沒有直接來篇文章介紹，觀念上再遇到的時候又會亂掉了。這篇主要會介紹 viewport ，當中包含了 viewb...
Day10 - SVG fill 填色
介紹過了 stroke 邊框之後，接下來就要介紹 fill 填色。( oxxostudio.tw 同步發表：SVG 研究之路 (7) - fill 填色 ，現在...