系统掌握图形学与可视化核心原理
从 0 到 1 构建可视化技术体系
掌握 4 大绘图系统底层实现原理
开发适合自己的可视化工具集
案例 + 代码，实现 3D 可视化大屏

根据可视化的实现方式，课程分为以下五个部分。

图形基础：带你熟悉 HTML/CSS、SVG、Canvas2D 和 WebGL 这四种图形系统，学会它们的基本用法、优点和局限性，从而能在实际应用中选择合适的图形系统，以达到最好的视觉效果。

数学基础：深入讲解向量、矩阵运算、参数方程、三角剖分以及仿射变换等内容，并配合综合运用，帮你建立一套通用的数学知识体系，适用于所有图形系统，以此来解决可视化图形呈现中的大部分问题。

视觉呈现：和你讨论像素化、动画、3D 和交互等话题，结合美颜、图片处理和视觉特效等实际例子，来应用各种数学和图形学知识，帮你全面提升视觉呈现的能力，实现更高级的视觉效果。

性能优化：通过学习 WebGL 渲染复杂的 2D、3D 模型的方法，了解可视化高性能渲染的技术思路。在这一模块月影将和你分享他总结的一些成熟的方法论，帮助你在实现可视化项目的时候，解决大规模数据批量渲染的性能瓶颈问题。

数据驱动：结合 3D 柱状图、3D 层级结构图、3D 音乐可视化等案例，讲解数据处理的技巧，真正正将数据和视觉呈现结合起来，实现具有科技感的 3D 可视化大屏效果，最终形成完整的可视化解决方案。

〖课程截图〗:

├──jk53801-跟月影学可视化

|   ├──0-21

|   |   ├──00丨开篇词丨不写网页的前端工程师，还能干什么？_.html  4.83M

|   |   ├──00丨开篇词丨不写网页的前端工程师，还能干什么？_.m4a  10.52M

|   |   ├──00丨开篇词丨不写网页的前端工程师，还能干什么？_.pdf  2.01M

|   |   ├──00丨预习丨Web前端与可视化到底有什么区别？_.html  4.10M

|   |   ├──00丨预习丨Web前端与可视化到底有什么区别？_.m4a  8.41M

|   |   ├──00丨预习丨Web前端与可视化到底有什么区别？_.pdf  3.01M

|   |   ├──01丨浏览器中实现可视化的四种方式_.html  3.74M

|   |   ├──01丨浏览器中实现可视化的四种方式_.m4a  13.49M

|   |   ├──01丨浏览器中实现可视化的四种方式_.pdf  2.29M

|   |   ├──02丨指令式绘图系统：如何用Canvas绘制层次关系图？_.html  2.51M

|   |   ├──02丨指令式绘图系统：如何用Canvas绘制层次关系图？_.m4a  14.59M

|   |   ├──02丨指令式绘图系统：如何用Canvas绘制层次关系图？_.pdf  1.62M

|   |   ├──03丨声明式图形系统：如何用SVG图形元素绘制可视化图表？_.html  3.62M

|   |   ├──03丨声明式图形系统：如何用SVG图形元素绘制可视化图表？_.m4a  11.78M

|   |   ├──03丨声明式图形系统：如何用SVG图形元素绘制可视化图表？_.pdf  1.30M

|   |   ├──04丨GPU与渲染管线：如何用WebGL绘制最简单的几何图形？（上）_.html  2.66M

|   |   ├──04丨GPU与渲染管线：如何用WebGL绘制最简单的几何图形？（上）_.m4a  8.42M

|   |   ├──04丨GPU与渲染管线：如何用WebGL绘制最简单的几何图形？（上）_.pdf  1.77M

|   |   ├──04丨GPU与渲染管线：如何用WebGL绘制最简单的几何图形？（下）_.html  2.39M

|   |   ├──04丨GPU与渲染管线：如何用WebGL绘制最简单的几何图形？（下）_.m4a  9.12M

|   |   ├──04丨GPU与渲染管线：如何用WebGL绘制最简单的几何图形？（下）_.pdf  1.57M

|   |   ├──05丨如何用向量和坐标系描述点和线段？_.html  3.97M

|   |   ├──05丨如何用向量和坐标系描述点和线段？_.m4a  12.18M

|   |   ├──05丨如何用向量和坐标系描述点和线段？_.pdf  2.75M

|   |   ├──06丨可视化中你必须要掌握的向量乘法知识_.html  2.54M

|   |   ├──06丨可视化中你必须要掌握的向量乘法知识_.m4a  7.06M

|   |   ├──06丨可视化中你必须要掌握的向量乘法知识_.pdf  1.58M

|   |   ├──07丨如何用向量和参数方程描述曲线？_.html  3.72M

|   |   ├──07丨如何用向量和参数方程描述曲线？_.m4a  10.57M

|   |   ├──07丨如何用向量和参数方程描述曲线？_.pdf  2.09M

|   |   ├──08丨如何利用三角剖分和向量操作描述并处理多边形？_.html  3.86M

|   |   ├──08丨如何利用三角剖分和向量操作描述并处理多边形？_.m4a  13.80M

|   |   ├──08丨如何利用三角剖分和向量操作描述并处理多边形？_.pdf  1.79M

|   |   ├──09丨如何用仿射变换对几何图形进行坐标变换？_.html  3.90M

|   |   ├──09丨如何用仿射变换对几何图形进行坐标变换？_.m4a  14.31M

|   |   ├──09丨如何用仿射变换对几何图形进行坐标变换？_.pdf  2.40M

|   |   ├──10丨图形系统如何表示颜色？_.html  3.06M

|   |   ├──10丨图形系统如何表示颜色？_.m4a  12.68M

|   |   ├──10丨图形系统如何表示颜色？_.pdf  2.29M

|   |   ├──11｜图案生成：如何生成重复图案、分形图案以及随机效果？_.html  11.29M

|   |   ├──11｜图案生成：如何生成重复图案、分形图案以及随机效果？_.m4a  14.43M

|   |   ├──11｜图案生成：如何生成重复图案、分形图案以及随机效果？_.pdf  3.15M

|   |   ├──12丨如何使用滤镜函数实现美颜效果？_.html  5.90M

|   |   ├──12丨如何使用滤镜函数实现美颜效果？_.m4a  14.00M

|   |   ├──12丨如何使用滤镜函数实现美颜效果？_.pdf  3.86M

|   |   ├──13丨如何给简单的图案添加纹理和复杂滤镜？_.html  9.21M

|   |   ├──13丨如何给简单的图案添加纹理和复杂滤镜？_.m4a  10.02M

|   |   ├──13丨如何给简单的图案添加纹理和复杂滤镜？_.pdf  5.50M

|   |   ├──14丨如何使用片元着色器进行几何造型？_.html  35.67M

|   |   ├──14丨如何使用片元着色器进行几何造型？_.m4a  10.47M

|   |   ├──14丨如何使用片元着色器进行几何造型？_.pdf  3.01M

|   |   ├──15丨如何用极坐标系绘制有趣图案？_.html  7.63M

|   |   ├──15丨如何用极坐标系绘制有趣图案？_.m4a  10.45M

|   |   ├──15丨如何用极坐标系绘制有趣图案？_.pdf  2.59M

|   |   ├──16丨如何使用噪声生成复杂的纹理？_.html  24.13M

|   |   ├──16丨如何使用噪声生成复杂的纹理？_.m4a  8.28M

|   |   ├──16丨如何使用噪声生成复杂的纹理？_.pdf  4.57M

|   |   ├──17丨如何使用后期处理通道增强图像效果？_.html  8.96M

|   |   ├──17丨如何使用后期处理通道增强图像效果？_.m4a  9.56M

|   |   ├──17丨如何使用后期处理通道增强图像效果？_.pdf  3.35M

|   |   ├──18丨如何生成简单动画让图形动起来？_.html  3.51M

|   |   ├──18丨如何生成简单动画让图形动起来？_.m4a  9.72M

|   |   ├──18丨如何生成简单动画让图形动起来？_.pdf  1.50M

|   |   ├──19丨如何用着色器实现像素动画？_.html  9.80M

|   |   ├──19丨如何用着色器实现像素动画？_.m4a  8.14M

|   |   ├──19丨如何用着色器实现像素动画？_.pdf  1.36M

|   |   ├──20丨如何用WebGL绘制3D物体？_.html  4.62M

|   |   ├──20丨如何用WebGL绘制3D物体？_.m4a  7.72M

|   |   ├──20丨如何用WebGL绘制3D物体？_.pdf  1.55M

|   |   ├──21丨如何添加相机，用透视原理对物体进行投影？_.html  3.71M

|   |   ├──21丨如何添加相机，用透视原理对物体进行投影？_.m4a  8.13M

|   |   ├──21丨如何添加相机，用透视原理对物体进行投影？_.pdf  1.73M

|   |   ├──加餐一丨作为一名程序员，数学到底要多好？_.html  7.42M

|   |   ├──加餐一丨作为一名程序员，数学到底要多好？_.m4a  11.43M

|   |   └──加餐一丨作为一名程序员，数学到底要多好？_.pdf  4.06M

|   └──22-32

|   |   ├──22丨如何用仿射变换来移动和旋转3D物体？_.html  4.54M

|   |   ├──22丨如何用仿射变换来移动和旋转3D物体？_.m4a  8.95M

|   |   ├──22丨如何用仿射变换来移动和旋转3D物体？_.pdf  1.63M

|   |   ├──23丨如何模拟光照让3D场景更逼真？（上）_.html  9.42M

|   |   ├──23丨如何模拟光照让3D场景更逼真？（上）_.m4a  7.10M

|   |   ├──23丨如何模拟光照让3D场景更逼真？（上）_.pdf  2.22M

|   |   ├──24丨如何模拟光照让3D场景更逼真？（下）_.html  5.66M

|   |   ├──24丨如何模拟光照让3D场景更逼真？（下）_.m4a  7.60M

|   |   ├──24丨如何模拟光照让3D场景更逼真？（下）_.pdf  1.57M

|   |   ├──25丨如何用法线贴图模拟真实物体表面_.html  7.69M

|   |   ├──25丨如何用法线贴图模拟真实物体表面_.m4a  6.76M

|   |   ├──25丨如何用法线贴图模拟真实物体表面_.pdf  1.85M

|   |   ├──26丨如何绘制带宽度的曲线？_.html  3.03M

|   |   ├──26丨如何绘制带宽度的曲线？_.m4a  7.93M

|   |   ├──26丨如何绘制带宽度的曲线？_.pdf  1.69M

|   |   ├──27丨案例：如何实现简单的3D可视化图表？_.html  15.11M

|   |   ├──27丨案例：如何实现简单的3D可视化图表？_.m4a  9.14M

|   |   ├──27丨案例：如何实现简单的3D可视化图表？_.pdf  2.39M

|   |   ├──28丨Canvas、SVG与WebGL在性能上的优势与劣势_.html  3.56M

|   |   ├──28丨Canvas、SVG与WebGL在性能上的优势与劣势_.m4a  10.53M

|   |   ├──28丨Canvas、SVG与WebGL在性能上的优势与劣势_.pdf  2.38M

|   |   ├──29丨怎么给Canvas绘制加速？_.html  20.70M

|   |   ├──29丨怎么给Canvas绘制加速？_.m4a  12.04M

|   |   ├──29丨怎么给Canvas绘制加速？_.pdf  2.25M

|   |   ├──30｜怎么给WebGL绘制加速？_.html  5.28M

|   |   ├──30｜怎么给WebGL绘制加速？_.m4a  11.18M

|   |   ├──30｜怎么给WebGL绘制加速？_.pdf  1.67M

|   |   ├──31丨针对海量数据，如何优化性能？_.html  7.17M

|   |   ├──31丨针对海量数据，如何优化性能？_.m4a  8.63M

|   |   ├──31丨针对海量数据，如何优化性能？_.pdf  2.83M

|   |   ├──32丨数据之美：如何选择合适的方法对数据进行可视化处理？_.html  9.28M

|   |   ├──32丨数据之美：如何选择合适的方法对数据进行可视化处理？_.m4a  8.19M

|   |   ├──32丨数据之美：如何选择合适的方法对数据进行可视化处理？_.pdf  2.64M

|   |   ├──加餐二丨SpriteJS：我是如何设计一个可视化图形渲染引擎的？_.html  10.49M

|   |   ├──加餐二丨SpriteJS：我是如何设计一个可视化图形渲染引擎的？_.m4a  10.19M

|   |   ├──加餐二丨SpriteJS：我是如何设计一个可视化图形渲染引擎的？_.pdf  2.20M

|   |   ├──加餐三丨轻松一刻：我想和你聊聊前端的未来_.html  2.10M

|   |   ├──加餐三丨轻松一刻：我想和你聊聊前端的未来_.m4a  6.44M

|   |   ├──加餐三丨轻松一刻：我想和你聊聊前端的未来_.pdf  1.42M

|   |   ├──加餐一丨作为一名程序员，数学到底要多好？_.html  7.42M

|   |   ├──加餐一丨作为一名程序员，数学到底要多好？_.m4a  11.43M

|   |   ├──加餐一丨作为一名程序员，数学到底要多好？_.pdf  4.06M

|   |   ├──用户故事丨非前端开发，我为什么要学可视化？_.html  2.13M

|   |   ├──用户故事丨非前端开发，我为什么要学可视化？_.m4a  5.89M

|   |   └──用户故事丨非前端开发，我为什么要学可视化？_.pdf  1.38M