剑指three-自学系列

很高兴我们又见面了，这一章节很是重要，我写了好几个案例来辅助学习 什么是位置属性 位置属性告诉电脑模型的“顶点”在哪里 大胆想象一下，假设我们想在电脑里面画一个简单的三角形，这个三角形由3个点（称为顶

理解法线属性 想象一下， 我们有一个 3D 模型，比如一个光滑的球体或者一个立方体。这个模型是由很多很多小三角形（面）拼成的。 每个小三角形有三个尖角，我们管它叫“顶点”（Vertex）  所以模型上

前言 好久不见，感谢大家一直以来的关注，最近因工作繁忙，断更好久，今天忙里抽闲继续写点我对three.js的学习心得，内容不是很多，我尽量控制在10分钟内 颜色属性是指什么 颜色属性就是指给缓冲几何体

什么是缓冲几何体 假设我们要在电脑屏幕上画一个 3D 的立方体。这个立方体由很多个小的三角形面片组成（这是 WebGL 绘制的基础）。每个三角形的角叫做顶点。每个顶点至少需要知道： 位置信息：它在 3

理解概念 我们可以用快递仓库的比喻来理解three.js中的缓冲属性BufferAttribute 想象我们要运送1000个快递包裹到仓库： 普通卡车（普通数组） ： 包裹随便堆在车厢里，每次取货都要

理解包围盒 想象一下 我们有一个形状非常复杂的物体：比如一个张牙舞爪的雕塑、一个毛绒玩具熊、或者你自己组装的乐高模型。 想要把它装进快递盒里寄走： 我们不会为它量身定制一个完全贴合每一个凸起和凹陷的盒

什么是盒子辅助器 BoxHelper 是 Three.js 的“3D 物体尺子”，能自动给任意物体包上一个会变形的彩色线框盒子，帮你直观看到物体的位置、大小和旋转状态。 假设我们在玩《我的世界》： 我

几何体是什么 几何体就像3D模型的“骨架” ，它定义了物体的形状（比如一个立方体有几个角、球体有多圆），但不包含颜色、纹理等表面细节 其本质是一组数学数据，包含：  顶点（Vertices） ： 3D

什么是基础材质 想象我们给一个3D模型（比如一个立方体或球体）涂颜色。基础材质就像是用一种固定颜色的油漆直接刷上去，它完全忽略光线的影响。也就是说，无论场景中有没有灯光，物体看起来都一样亮，颜色不会变

箭头辅助器是什么 想象一下我们在玩一个3D建造游戏或者看一个科学模拟动画。如果想直观地看到： 这个物体是朝哪边转的？  (比如一个陀螺的旋转轴) 这个力是往哪个方向推的？  (比如一阵风吹的方向) 这

动画混合核心原理 动画混合（Animation Blending）  就像一位 DJ 同时播放多首歌，并将它们自然过渡拼接成一首新曲。它让 3D 模型（比如游戏角色）能在不同动作之间平滑切换（如从“走

什么是环境光 想象一下阴天在户外的感觉： 整个天空像一个巨大的、均匀的发光体☁️ 光线从四面八方柔和地洒下来 你站在任何地方，身上受光程度几乎一样，没有明显的影子 核心特点 特性 现实比喻 代码体现

什么是透明贴图 核心作用：像「镂空剪纸」一样控制物体哪些部位透明/不透明 （想象：给树叶模型贴图，透明部分让树叶边缘自然消失而非方形边缘） 技术本质：一张 黑白图片（如 PNG 带透明通道），其中：

本章主要学习知识点 学习如何使用tweenjs创建动画 使用tweenjs实现相机运动动画 掌握如何实现相机飞行靠近观察设备 实现点击模型放大预览 tweenjs创建动画 Tween.js 创建动画主

本章主要学习知识点 了解什么是关键帧动画 掌握动画的各种控制方法 学会如何解析并播放外部模型自带的动画 关键帧动画 关键帧动画就像给 3D 模型制作“动态剧本”——通过在时间轴上设定关键动作点，让模型

本章主要学习知识点 了解并掌握如何使用CSS2DRenderer渲染器 学习如何设置标签位置 掌握如何制作标签指示线 实现标签交互效果 了解并掌握如何使用CSS3DRenderer渲染器 掌握如何批量

本章主要学习知识点 了解射线概念 实现如何通过点击选中场景中的模型 掌握如何通过点击拾取层级中的模型 学会如何拾取精灵模型并控制场景中 射线Ray 射线（Ray）  就像一根虚拟的“激光笔”，用于检测

本章主要学习知识点 掌握对模型实现发光描边 了解发光通道概念，以及如何运用Bloom发光通道 掌握多通道组合运用 尝试在外部加载的模型上设置发光 后处理发光描边 后处理发光描边效果 可以理解为给3D模

本章主要学习知识点 了解环境光贴图，并练习如何使用 了解什么事精灵模型 使用精灵模型实现标注场景贴图 掌握如何使用精灵模型模拟粒子移动 光源环境贴图 光源环境贴图可以理解为一种让物体表面「反射周围环境

本章主要学习知识点 了解聚光源概念 聚光源SpotLight 聚光源（SpotLight）可以理解为「虚拟手电筒」，它能产生类似舞台聚光灯的锥形光束效果。 聚光源具有以下特性 方向性： 聚光灯有明确的