[udemy] 带着色器的中级 Three.js | Intermediate Three.js with Shaders

您将学到什么

创建和理解 ThreeJS 着色器的合成和设置
如何将纹理导入着色器以创建地球
如何创建顶点和片段着色器
如何将着色器导入 vite 项目
了解复杂的 3D 术语，如法线、属性、变量、和 UV
如何在具有纬度和经度的地球上绘制交互式数据点
如何导入批量数据并将其读取到场景中
如何使用 GSAP 为生成的网格设置动画
如何向地球添加单击和拖动功能
如何缩放 3D 场景更小的屏幕尺寸
如何添加移动事件监听器

要求

您必须已经有安装了 ThreeJS 的开发环境 – 我在这里使用 Vite，您可以通过在 Udemy
Vite 上学习我的 Modern ThreeJS 课程来学习如何做，建议前端服务器安装 ThreeJS，但不需要
ThreeJS 版本推荐 ^0.128.0（在课程中使用），但不是必需的

说明

欢迎来到带着色器的中级 ThreeJS 课程，您将在其中学习如何使用自定义 ThreeJS 着色器创建交互式 3d 地球。

我的名字是 Christopher Lis，我是一名获奖的全栈工程师，拥有超过十年的 Web 开发经验。我曾直接与哈佛大学、篮球锦标赛等客户以及 Brave People 等优质获奖机构合作。

本课程的目标是让您使用 GLSL 编写自己的自定义 ThreeJS 着色器，并帮助您了解如何将这些着色器导入到实际的 ThreeJS 场景中。您还将学习如何根据不同国家/地区的纬度和经度在地球上动态放置数据点。几乎没有视频可以深入探讨这个话题，所以我想我应该解决它。

在本课程中，您将从

– 顶点着色器

– 片段着色器

– 使用 Vite 插件导入着色器

– 法线

– 制服

– 属性

– 变化

– 点云和粒子

– 批量数据导入

– 矩形网格动画

– 单击和拖动功能

– 场景响应

– 触摸事件监听器

还有更多。

如果您真的想将您的 ThreeJS 技能提升到一个新的水平，那么在熟悉该框架之后，着色器在逻辑上是下一步。让我指导您完成可实际用于真实网站的 3d 场景的完整制作。

本课程面向

谁知道如何使用材质、几何图形和网格创建场景的中级 ThreeJS 开发人员