摘要： Three.js 中的CylinderGeometry类用于创建圆柱形或圆锥形状的几何体。它可以用来表示管道、柱子、杯子等圆柱形物体，也能通过调整参数创建圆锥体。 基本参数 CylinderGeometry构造函数的基本参数如下： new THREE.CylinderGeometry( radius 阅读全文

摘要： Ray Marching是一种基于距离场的渐进式光线追踪技术，通过逐步推进光线并利用距离函数（SDF）检测场景中的物体表面，广泛应用于体积渲染（如云、雾）和复杂几何体渲染。以下从原理、实现到应用展开详解： ⚙️ 一、核心原理 光线步进（Ray Marching）从摄像机向每个像素发射光线（Ray）， 阅读全文

摘要： 1. 动作 2. 嘴型 3. 风格化 阅读全文

摘要： 首先，模型(坐标)需要归一化。 阅读全文

摘要： THREE.PlaneGeometry 是 Three.js 库中用于创建平面几何体的类，其构造函数 new THREE.PlaneGeometry(width, height, widthSegments, heightSegments) 的四个参数含义如下： width平面在 X 轴方向的宽度（ 阅读全文

摘要： 在着色器（Shader）编程里，dot 函数是一个相当关键的数学函数，主要用于计算两个向量的点积（也被称作标量积）。下面为你详细介绍它的定义、功能和常见的应用场景。 数学定义 对于两个向量 A 和 B，它们的点积是这样计算的： \(\mathbf{A} \cdot \mathbf{B} = |\ma 阅读全文

摘要： 在着色器语言里，二维向量能够除以另一个二维向量，这是源于着色器语言普遍支持按分量运算。下面为你详细解释其原因和工作机制： 按分量运算 按分量运算是着色器语言的一个重要特性，它指的是对向量的每个分量分别进行运算。以二维向量相除为例，就是将两个向量对应位置的分量逐个相除，最终得到一个新的二维向量。用公式 阅读全文

摘要： x∈[0,width] x/width*2-1∈[-1,1] 阅读全文

摘要： THREE.Clock 是 Three.js 中的一个实用类，用于跟踪和管理时间。它主要用于计算两帧之间的时间差（delta time），这在实现动画、物理模拟或其他需要基于时间的平滑运动时非常有用。 基本用法 以下是 THREE.Clock 的基本使用方法： // 创建一个时钟实例，自动开始计时 阅读全文

摘要： Next.js 是一个基于 React 的开源框架，用于构建高性能、可扩展的 Web 应用程序。它由 Vercel（前身为 ZEIT）开发和维护，结合了 React 的组件化开发能力与服务器端渲染（SSR）、静态站点生成（SSG）等功能，使开发者能够更高效地构建现代化网站和应用。 核心特性 服务器端 阅读全文