簡(jiǎn)介:本課程為Canvas系列課程第二課。通過對(duì)《絢麗的倒計(jì)時(shí)效果的學(xué)習(xí)》,在大家對(duì)Canvas繪圖有一定了解的基礎(chǔ)上,本課程對(duì)Canvas的各個(gè)圖形接口進(jìn)行了系統(tǒng)詳細(xì)地介紹,并輔以示例,讓同學(xué)徹底掌握Canvas繪圖,隨心所欲在瀏覽器上繪制炫麗效果!
第1章 讓我們繼續(xù)Canvas繪圖之旅
通過《絢麗的倒計(jì)時(shí)效果》,相信大家已經(jīng)對(duì)Canvas繪圖有了基礎(chǔ)的理解。現(xiàn)在,讓我們繼續(xù)Canvas之旅吧!
第2章 從線條開始
線條元素雖然簡(jiǎn)單,但不可小覷。它是構(gòu)成圖形的基礎(chǔ)元素。本章詳細(xì)介紹了Canvas繪圖中使用線條構(gòu)成基本圖形元素的方法。
第3章 線條的屬性
引入一個(gè)更加復(fù)雜的圖形繪制案例——畫一個(gè)五角星。并且通過這個(gè)案例,詳細(xì)說明Canvas線條屬性的使用。
第4章 星空和圖形變換
拓展五角星的繪制,繪制多個(gè)五角星組成一片星空,并且據(jù)此介紹Canvas中圖形變換相關(guān)功能的使用。
第5章 填充樣式
本章詳細(xì)介紹了fillStyle可以使用的所有樣式。除了使用一種顏色以外,還包括使用線性漸變或者徑向漸變進(jìn)行漸變色的填充;使用圖片、畫布或者video視頻進(jìn)行樣式填充。
第6章 曲線的繪制
本章詳細(xì)分析了Canvas繪圖提供的四個(gè)曲線繪制函數(shù),使得大家可以在自己的Canvas畫布上任意繪制弧線或者曲線,大大拓展了繪制的靈活性。
第7章 文字的渲染
本章詳細(xì)介紹了在canvas上進(jìn)行文字渲染的方式。學(xué)習(xí)本章后,大家可以圖文并茂地使用Canvas,創(chuàng)建屬于自己的Canvas應(yīng)用。
第8章 Canvas高級(jí)內(nèi)容
給自己的繪圖添加陰影;制定全局透明色;制作絢麗的探照燈效果或者剪紙效果;為Canvas繪圖添加交互能力……本章探討了5個(gè)不同側(cè)面的高級(jí)話題,讓你意識(shí)到,Canvas繪圖——只有想不到,沒有做不到!
第9章 Canvas之旅仍在繼續(xù)
Canvas是如此的具有魅力,將web從傳統(tǒng)的文檔顯示帶入了一個(gè)全新的境地。Canvas標(biāo)準(zhǔn)一直在更新,同時(shí),我們的Canvas之旅遠(yuǎn)沒結(jié)束。讓我們一起看看,使用Canvas,我們還有可能做出什么。