| |
HTML5圖形開發(fā)入門課程
|
| |
 班級規(guī)模及環(huán)境--熱線:4008699035 手機(jī):15921673576( 微信同號) |
| 每個班級的人數(shù)限3到5人，互動授課， 保障效果，小班授課。 |
| 上間和地點(diǎn) |
上部份地點(diǎn)：【上海】同濟(jì)大學(xué)(滬西)/新城金郡商務(wù)樓(11號線白銀路站)【深圳分部】：電影大廈(地鐵一號線大劇院站)/深圳大學(xué)成教院【北京分部】：北京中山學(xué)院/福鑫大樓【南京分部】：金港大廈(和燕路)【武漢分部】：佳源大廈（高新二路）【成都分部】：領(lǐng)館區(qū)1號（中和大道）【沈陽分部】：沈陽理工大學(xué)/六宅臻品【鄭州分部】：鄭州大學(xué)/錦華大廈【石家莊分部】：河北科技大學(xué)/瑞景大廈
最近開間(周末班/連續(xù)班/晚班）：2020年3月16日 |
| 實(shí)驗(yàn)設(shè)備 |
◆小班教學(xué)，教學(xué)效果好
☆注重質(zhì)量☆邊講邊練
☆合格學(xué)員免費(fèi)推薦工作
★實(shí)驗(yàn)設(shè)備請點(diǎn)擊這兒查看★ |
| 質(zhì)量保障 |
1、培訓(xùn)過程中，如有部分內(nèi)容理解不透或消化不好，可免費(fèi)在以后培訓(xùn)班中重聽；
2、培訓(xùn)結(jié)束后,授課老師留給學(xué)員聯(lián)系方式,保障培訓(xùn)效果,免費(fèi)提供課后技術(shù)支持。
3、培訓(xùn)合格學(xué)員可享受免費(fèi)推薦就業(yè)機(jī)會。☆合格學(xué)員免費(fèi)頒發(fā)相關(guān)工程師等資格證書，提升職業(yè)資質(zhì)。專注高端技術(shù)培訓(xùn)15年，端海學(xué)員的能力得到大家的認(rèn)同，受到用人單位的廣泛贊譽(yù)，端海的證書受到廣泛認(rèn)可。 |
部份程大綱 |
| |
第一章：Canvas路徑運(yùn)用及圖形操作
1-1 認(rèn)識HTML5圖形開發(fā)
1-2 創(chuàng)建畫布canvas，獲取畫筆
1-3 認(rèn)識坐標(biāo)系
1-4 繪制直線，矩形，多邊形
1-5 圖形的描邊與填充
1-6 矩形的快捷繪制
1-7 新路徑，掌握beginPath方法的使用
1-8 其它繪制屬性(lineCap,lineJoin)的使用
1-9 路徑-圓弧, 圓弧(arc)方法的使用
1-10 繪制屬性globalAlpha的使用
1-11 繪制笑臉-基礎(chǔ)路徑的使用
1-12 繪制月亮
1-13 繪制折線圖(1)
1-14 繪制折線圖(2)
第二章：理解并掌握Canvas圖形變換
2-1 基本變換-位移(translate)
2-2 基本變換-旋轉(zhuǎn)(rotate)
2-3 基本變換-縮放(scale)
2-4 求兩點(diǎn)間距離
2-5 認(rèn)識基本三角函數(shù)(sin, cos, atan2)
2-6 認(rèn)識矩陣(變換的原理)1 - 選學(xué)
2-7 認(rèn)識矩陣(變換的原理)2 - 選學(xué)
2-8 三種基本變換的疊加,變換順序?qū)D形的影響-1
2-9 三種基本變換的疊加,變換順序?qū)D形的影響-2
2-10 變換與繪制樣式的保存與恢復(fù)1
2-11 變換與繪制樣式的保存與恢復(fù)2
2-12 實(shí)例1-繪制五角星（1）
2-13 實(shí)例1-繪制五角星（2）
2-14 實(shí)例2-繪制虛線（1）
2-15 實(shí)例2-繪制虛線（2）
2-16 實(shí)例3-繪制五星紅旗
第三章： canvas圖形動畫
3-1 認(rèn)識動畫
3-2 普通div的動畫
3-3 canvas動畫-1(clearRect使用)
3-4 canvas動畫-2(requestAnimationFrame使用)
3-5 勻速運(yùn)動(速度始終如一)
3-6 緩沖運(yùn)動(越來越慢)
3-7 彈性運(yùn)動(感覺像彈簧運(yùn)動)
3-9 小球在空間內(nèi)的自由運(yùn)動(運(yùn)動范圍限定)
3-10 實(shí)例-帶影子的物體運(yùn)動
第四章：與canvas圖形發(fā)生交互
4-1 判斷點(diǎn)是否在一個矩形范圍內(nèi)
4-2 選項(xiàng)卡(pointInPath使用)
4-3 圓形圖形的事件獲取
4-4 矩形圖形的拖動
4-5 矩形與矩形之間的碰撞測驗(yàn)-1
4-6 矩形與矩形之間的碰撞測驗(yàn)-2
4-7 圓形與圓形之間的碰撞測驗(yàn)-1
4-8 圓形與圓形之間的碰撞測驗(yàn)-2
4-9 實(shí)例-煙花1
4-10 實(shí)例-煙花2
4-11 實(shí)例-煙花3
4-12 實(shí)例-別踩白塊兒開發(fā)1
4-13 實(shí)例-別踩白塊兒開發(fā)2
4-14 實(shí)例-別踩白塊兒開發(fā)3
第五章：canvas位圖圖像
5-1 canvas繪制位圖(初看drawimage)
5-2 繪制位圖drawImage方法詳解
5-3 實(shí)例-行走中的英雄1
5-4 實(shí)例-行走中的英雄2
5-5 實(shí)例-子彈打中物體后的爆炸效果1
5-6 實(shí)例-子彈打中物體后的暴炸效果2
5-7 實(shí)例-子彈打中物體后的暴炸效果3
5-8 實(shí)例-合成優(yōu)美的風(fēng)景圖-圖片預(yù)加載1
5-9 實(shí)例-合成優(yōu)美的風(fēng)景圖-圖片預(yù)加載2
第六章:：canvas像素操作
6-1 認(rèn)識圖像像素(圖像像素組成了一維數(shù)組)
6-2 像素提取(getImageData方法使用)
6-3 操作像素改變圖像(putImageData使用)1
6-4 操作像素改變圖像(putImageData使用)2
6-5 繪制文字(font, fillText,strokeText)
6-6 繪制文字(自定義字體)
6-7 按圖像行列定位像素數(shù)據(jù)的位置
6-8 圖形算法-圖像轉(zhuǎn)黑白
6-9 圖形算法-模糊效果
6-10 像素文字(文字像素塊)
6-11 像素文字(打散)
6-12 像素文字(復(fù)原)
第七章：canvas繪制高級
7-1 線性漸變的繪制
7-2 徑向漸變的繪制
7-3 canvas內(nèi)置的漸變樣式
7-4 掌握圖形裁剪(clip方法應(yīng)用)
7-5 給圖形填充圖案
7-6 路徑的方向-基礎(chǔ)
7-7 路徑的方向-實(shí)戰(zhàn)
7-8 設(shè)置canvas寬高的正確方式(對比CSS設(shè)置寬高)
7-9 刮刮樂-像素操作透明度通道
7-10 圖片在矩形容器內(nèi)的自適應(yīng)
7-11 給合同簽字
7-12 繪制柱狀圖
7-13 繪制餅狀圖
7-14 繪制熱區(qū)圖
第八章：SVG矢量圖
8-1 認(rèn)識SVG矢量圖
8-2 svg基本圖形
8-3 與svg圖形進(jìn)行交互
8-4 g標(biāo)簽的使用
8-5 詳解transform屬性
8-6 svg圖形拖拽(拖動椅子)
8-7 svg圖形標(biāo)簽transform屬性小例子
8-8 重復(fù)使用svg圖形(defs標(biāo)簽使用)
8-9 SVG鐘表
8-10 svg漸變-linearGradient
8-11 svg漸變-radialGradient
8-12 path詳解1-多邊形(line,rect,polygon)
8-13 path詳解2-弧或圓
8-14 繪制放大鏡(path應(yīng)用)
8-15 實(shí)例1繪制折線圖
8-16 實(shí)例2繪制餅狀圖
8-17 實(shí)例3繪制餅狀圖(添加事件交互) |
|
|
|
|
- |
首頁 課程表 在線聊 報名 講師 品牌 QQ聊 活動 就業(yè)