SVG 自學微筆記(10) - SVG...為什麼?
基本上是這系列最後一篇,除非之後接觸到跟SVG相關的有趣應用! (≧▽≦) 我在大學畢業的最後一學期,選修了網頁資料視覺化的課程,課程主要使用D3.js這個JavaScript擴充函式庫做資料視覺化的工作。那D3.js是什麼? 跟SVG有什麼關係呢? D3.js D3指的是Data-Driven Document,以資料驅動編輯網頁的DOM,更白話的說法就是可以根據資料的筆數,動態地生成相同數
基本上是這系列最後一篇,除非之後接觸到跟SVG相關的有趣應用! (≧▽≦) 我在大學畢業的最後一學期,選修了網頁資料視覺化的課程,課程主要使用D3.js這個JavaScript擴充函式庫做資料視覺化的工作。那D3.js是什麼? 跟SVG有什麼關係呢? D3.js D3指的是Data-Driven Document,以資料驅動編輯網頁的DOM,更白話的說法就是可以根據資料的筆數,動態地生成相同數
SVG 自學微筆記完! (๑´ㅂ`๑) 學習資源: W3Schools、其他網路資料 說到SVG中最複雜的東西,路徑(Path)絕對是一個大魔王,它有太多的commands可以用來定義路徑。透過Path雖然可以繪製效果不錯的SVG圖形,但是要自己定義一個個坐標點,再去把它們完美的串連在一起,實在是件非常困難的事。 W3Schools的SVG Path教學在最後提到,因為Path太複雜的關係
不定更新、即將迎來結尾 (๑´ㅂ`๑) 學習資源: W3Schools、其他網路資料 漸層(Gradients)是W3Schools關於SVG基礎教學的最後部分,漸層的效果就是讓顏色漸漸地轉變成另一種顏色,而在SVG中的漸層又有兩種主要的類型,分別是線性(Linear)漸層和放射(Radial)漸層。 SVG : 漸層 (僅列出部分有使用到的屬性) <svg></sv
不定更新、可能爛尾XD 學習資源: W3Schools、其他網路資料 SVG有提供Filter(濾鏡)這個東西,可以用來在SVG圖形上加入特殊的效果,像是圖形模糊化、產生圖形陰影、將雜訊加入圖形等。以下介紹的是圖形模糊化、產生圖形陰影這2個濾鏡效果。 瀏覽器對於SVG Filter的支援 (取自SVG Filters - W3Schools) SVG : 濾鏡 (僅列出部分有使用到的
不定更新、可能爛尾XD 學習資源: W3Schools、其他網路資料 在前面的微筆記中,有使用到<line></line>來繪製線段,雖然還沒寫SVG Path的內容,但Path其實也能拿來繪製線段喔! 在本篇微筆記會使用到非常簡單的Path來繪製線段,並介紹幾種線段的特性(Stroke Property)。 SVG : 線段 (僅列出部分有使用到的屬性) &l
不定更新、可能爛尾XD 學習資源: W3Schools、其他網路資料 之前有段時間挺忙的,所以停更了好一陣子 ಥ⌣ಥ,但至少還沒爛尾 ٩(๑❛ᴗ❛๑)۶。 原本按照W3Schools的SVG教學,這篇筆記應該是關於Path的內容,不過SVG的Path實在是有點複雜(也可以說是SVG中最難的部分),所以我會放在比較後面才去寫筆記整理重點。 SVG : 文字 (僅列出部分有使用到的屬性)
不定更新、可能爛尾XD 學習資源: W3Schools、其他網路資料 SVG : 多邊形 (僅列出部分有使用到的屬性) <svg></svg> height : 整個圖形(畫布)的原始長度 width: 整個圖形(畫布)的原始寬度 <polygon></polygon> 或 <polygon /> points :
不定更新、可能爛尾XD 學習資源: W3Schools、其他網路資料 這篇筆記使用到的圖形屬性,基本上都跟矩形那篇差不多。 SVG : 圓形 (僅列出部分有使用到的屬性) <svg></svg> height : 整個圖形(畫布)的原始長度 width: 整個圖形(畫布)的原始寬度 <circle></circle> 或 <
不定更新、可能爛尾XD 學習資源: W3Schools、其他網路資料 前置 : 開發環境 在開始畫SVG圖形前,需要先建好開發環境,以下是我的配置 : (瀏覽器、原始碼編輯器、擴充套件) Chrome Microsoft Visual Studio Code Live Server (即時預覽網頁) Prettier - Code formatter (原始碼自動排版) Intelli
不定更新、可能爛尾XD 學習資源: W3Schools、其他網路資料 關於 SVG SVG 全名為 Scalable Vector Graphics 即"可縮放向量圖形",主要特點有這些 : SVG 圖形可自由進行縮放而不影響圖形的品質 SVG 圖形可經由文字編輯器建立、編輯 因為 SVG 採用 XML 格式進行編輯,而 XML 是以純文字作為基礎的標記式語言
分散式系統期末書面報告(IEEE格式) 開授課程系所 : 國立陽明交通大學資訊管理研究所 授課/指導教授 : 莊詠婷 教授 作者 : 資管所 碩一 張棨翔
Abstract 當我們探討區塊鏈技術應用於去中心化儲存網路(DSN)時,我們將依序研究三篇來自IEEE Transaction期刊的論文。這些論文提出了各自對於DSN的解決方案。DSN之所以受到青睞,是因為相較於中心化儲存網路,它具有許多優點。其中一大優點是可以避免單一中心節點故障導致所有資料無法
關於題目 不間斷學習是經營自己的不二法門, 而大學學習多著重在知識性, 但要有個幸福人生光獲得知識是不夠的。 希望同學寫這個作業的過程會如我在課堂說的,覺得自己很幸福。 感謝的人可以是父母老師兄弟姐妹(前)男女友同學朋友,請說明為何他成為你生命中有意義的人。也期望同學有一天成為別人生命中有意義的人。
分散式系統期中書面報告(IEEE格式) 開授課程系所 : 國立陽明交通大學資訊管理研究所 授課/指導教授 : 莊詠婷 教授 作者 : 資管所 碩一 張棨翔
Question 希望同學每天至少對別人說一句讚美的話,請記錄這兩週每天你總共說了那些讚美的話,如果都沒有的話,為什麼呢? Answer 仔細回顧這兩個禮拜的生活,其實我並不記得自己有說過什麼讚美其他人的話,或許可能有,只是我忘記了,這邊就當作我都沒有吧? 我必須承認我並不是一個會特別用言語去讚美或