JK-跟月影学可视化

开篇词 _ 不写网页的前端工程师，还能干什么？

预习 _ Web前端与可视化到底有什么区别？

10.结束语

2.图形基础篇

01 _ 浏览器中实现可视化的四种方式

02 _ 指令式绘图系统：如何用Canvas绘制层次关系图？

03 _ 声明式图形系统：如何用SVG图形元素绘制可视化图表？

04 _ GPU与渲染管线：如何用WebGL绘制最简单的几何图形？

3.数学篇

05 _ 如何用向量和坐标系描述点和线段？

06 _ 可视化中你必须要掌握的向量乘法知识

07 _ 如何用向量和参数方程描述曲线？

08 _ 如何利用三角剖分和向量操作描述并处理多边形？

09 _ 如何用仿射变换对几何图形进行坐标变换？

4.视觉基础篇

10 _ 图形系统如何表示颜色？

11图案生成：如何生成重复图案、分形图案以及随机效果？

12 _ 如何使用滤镜函数实现美颜效果？

13 _ 如何给简单的图案添加纹理和复杂滤镜？

14 _ 如何使用片元着色器进行几何造型？

15 _ 如何用极坐标系绘制有趣图案？

16 _ 如何使用噪声生成复杂的纹理？

17 _ 如何使用后期处理通道增强图像效果？

5.视觉高级篇

18 _ 如何生成简单动画让图形动起来？

19 _ 如何用着色器实现像素动画？

20 _ 如何用WebGL绘制3D物体？

21 _ 如何添加相机，用透视原理对物体进行投影？

22 _ 如何用仿射变换来移动和旋转3D物体？

23 _ 如何模拟光照让3D场景更逼真？（上）

24 _ 如何模拟光照让3D场景更逼真？（下）

25 _ 如何用法线贴图模拟真实物体表面

26 _ 如何绘制带宽度的曲线？

27 _ 案例：如何实现简单的3D可视化图表？

6.性能篇

28 _ Canvas、SVG与WebGL在性能上的优势与劣势

29 _ 怎么给Canvas绘制加速？

30怎么给WebGL绘制加速？

7.数据篇

31 _ 针对海量数据，如何优化性能？

32 _ 数据之美：如何选择合适的方法对数据进行可视化处理？

33 _ 数据处理（一）：可视化数据处理的一般方法是什么？

34 _ 数据处理（二）：如何处理多元变量？

35_ 设计（一）：如何让可视化设计更加清晰？

36 _ 设计（二）：如何理解可视化设计原则？

37 _ 实战（一）：如何使用图表库绘制常用数据图表？

38 _ 实战（二）：如何使用数据驱动框架绘制常用数据图表？

39 _ 实战（三）：如何实现地理信息的可视化？

40_ 实战（四）：如何实现3D地球可视化（上）？

41 _ 实战（五）：如何实现3D地球可视化（下）？

42 _ 如何整理出我们自己的可视化工具集？

8.国庆策划

国庆策划 _ 假期别闲着，一起来挑战“手势密码”

国庆策划 _ 快来看看怎么用原生JavaScript实现手势解锁组件

9.特别放送

加餐1 _ 作为一名程序员，数学到底要多好？

加餐2 _ SpriteJS：我是如何设计一个可视化图形渲染引擎的？

加餐3 _ 轻松一刻：我想和你聊聊前端的未来

加餐4 _ 一篇文章，带你快速理解函数式编程

用户故事 _ 非前端开发，我为什么要学可视化？