Canvas 实训项目
Html5教程 0

视频:20 

该系列教程视频面向掌握一定JS基础的学员,主要是围绕HTML5中的canvas标签绘制图形图片,课程由浅到深的详细讲解canvas相关API,最后结合经典案例进行编码演示,以达到在琐碎时间,循序渐进的学习效果。
选择班级:
  • 课程介绍
  • 课程目录

课程介绍:

该系列教程视频面向掌握一定Javascript基础的学员,主要是围绕HTML5中的canvas标签展开讲解,在画布上进行图形图片的绘制,整个课程由浅到深的详细讲解canvas相关API,最后结合经典案例进行编码演示,同学们可利用琐碎时间学习,技能水平从而循序渐进的提升。


课程内容涵盖:

一、课程内容

1. canvas 基础语法

2. canvas API的学习

3. canvas 案例编码演示

4. canvas 提升JS编码思维逻辑

5. canvas 可视化图形库

二、 开发工具

1. Visual Studio Code (VS code)

2. Google Chrome

三、 课程目标

利用canvas制作可视化数据图表

banner广告

特效制作

H5小游戏

四、 canvas 基础语法

五、 提供的API

1. 绘制线

2. 绘制路径的管理

3. 绘制矩形

4. 填充

5. 绘制弧线、弧形、圆形

6. 另外一种绘制弧线的方式

7. 贝塞尔曲线

8. 绘制文本

9. 设置图形透明度

10. 设置图形先后覆盖顺序(重叠)

11. 设置阴影

12. 绘制图片

13. 清除画布

14. 旋转、位移、缩放

15. 保存和回退

16. canvas交互

六、 案例演示


课程讲师:

王勇国

 H5讲师

主讲老师
王勇国