Three.js 3D Web 视觉化实战教程（第二部分）- 2019年9月16日

简介：
本教程为《Three.js 3D Web 视觉化实战》系列的第二部分，发布于2019年9月16日，深入讲解了如何使用Three.js库创建复杂的三维Web应用。 【视频教程】Hands-on Three.js 3D Web Visualizations - September 16, 2019 本课程使用英语授课，时长为3小时46分钟。 掌握Three.js库可以让你在网页浏览器甚至智能手机上展示令人惊叹的模型、游戏、音乐视频和科学/数据可视化。该教程从三维应用的基础概念开始介绍，例如顶点、面、网格、相机和渲染器，并通过一些基本示例帮助初学者快速入门。你将学会如何创建场景、摄像机以及渲染器等核心元素，掌握Three.js库提供的几何体原语以添加网格。 课程还涵盖了调试步骤以解决开发人员常遇到的问题，深入介绍该库中包含的复杂动画系统，并引入后期处理技术，在渲染后的图像上应用滤镜。此外还将探讨GLSL着色语言的应用方法，用于创建材质时会发现其实比想象中的要简单得多。 通过本教程的学习，你将能够快速为你的3D场景添加高级特性，改善用户交互方式并使它们看起来非常出色。 学习内容包括： - 掌握三维应用的基本概念：顶点、面、网格、相机和渲染器。 - 学会如何设置Three.js网页应用程序：创建场景、摄像机以及渲染器。 - 精通层级结构与父子关系，了解其对最终对象位置和方向的影响。 - 使用Three.js库探索简单的网格形状（如盒子、球体、圆柱体和平面等）的使用方法。 - 学会从源头获取或创建复杂的资产，并加载这些资源，包括纹理的学习过程。 - 掌握三JS动画系统的运用技巧。 - 为渲染图像添加后期处理功能，使其看起来像旧电影或者点阵打印效果。 - 引入GLSL着色语言的介绍。 课程内容包含： 1. 课程概述 2. Three.js网站简介 3. D基础概念 4. 第一个Three.js网页实例 5. 使用Three.js编辑器进行开发实践 6. 调试你的页面技巧与方法 7. 简单开始 - 利用盒子创建场景 8. 材质一：基本材质和线框材质介绍 9. 探索球体及圆柱体的使用案例 10. 材质二：兰伯特光照模型和菲涅尔反射光效的应用 11. 锥形物体与环面几何图形的学习路径 12. 场景层次结构管理技巧 13. 透视相机设置指南 14. 正交投影摄像机的使用场合及特点分析 15. 虚拟摄像头以及线性插值技术的应用场景解析 16. 复杂摄像机动态路径规划方法论探究 17. 环境光与半球光照效处理实践分享 18. 方向光源和点光源的实现细节探讨 19. 宽束灯光及矩形区域照明解决方案介绍 20. 如何在场景中添加阴影效果的技术讲解 21. 物理正确性光线的应用案例分析 22. 在线三维资源获取渠道推荐与使用技巧分享 23. Blender软件与Three.js结合使用的最佳实践探讨 24. GLTFLoader类的深入解析及应用场景介绍 25. FBXLoader类的功能详解及其在项目中的应用实例演示 26. 轮廓几何图形和拉伸几何体的学习路径分析 27. 动画系统基础概念讲解与入门技巧分享 28. 皮肤网格对象的概念理解以及实际运用案例展示 29. 切换动画及混合技术的应用场景解析 30. 分割一个动画片段的方法论探讨 31. WASD控制系统的实现方案介绍及其在角色人物中的应用实例演示 32. Three.js后期处理功能的深入讲解与实践分享 33. GLSL着色语言 - ShaderMaterial概念理解及入门技巧分享 34. GLSL顶点着色器的概念解析及其使用场景分析 35. 重要噪声函数在GLSL中的应用案例探讨与学习路径建议 36. GLSL纹理的介绍以及如何将它们应用于材质的学习路径分析