从基础开始：3D 数学基础（上）

在踏上 WebGL 游戏开发的征途时，掌握 3D 数学的基本知识至关重要。虽然我们无法在本章中详尽阐述所有 3D 数学原理（这将是一本独立的著作），但我们可以建立一个坚实的基础，为你的 WebGL 冒险奠定基础。

向量：基础构建模块

在 3D 数学的世界中，向量是构建一切的基石。向量本质上是具有幅度和方向的点，可以用箭头表示。它们是位置、运动和方向等物理量的理想选择。

旋转：在 3D 空间中转动

旋转是将对象围绕其轴旋转一定角度的过程。在 3D 数学中，我们使用旋转矩阵来实现这一变换。旋转矩阵本质上是将点从一个坐标系转换到另一个坐标系。

平移：在 3D 空间中移动

平移是将对象在 3D 空间中从一个点移动到另一个点。平移矩阵是执行此操作所必需的。与旋转矩阵类似，平移矩阵将点从一个坐标系转换到另一个坐标系。

缩放：在 3D 空间中调整大小

缩放是指增加或减小对象的尺寸。缩放矩阵被用来实现这一变换。缩放矩阵可以通过沿各个坐标轴缩放点来改变对象的尺寸。

矩阵：操纵 3D 空间

矩阵是 3D 数学中强大的工具，用于表示和操纵变换。它们由数字数组组成，可以用于执行各种操作，包括旋转、平移和缩放。矩阵提供了一种简洁有效的方式来组合这些变换。

深入理解：示例代码

为了加深理解，我们提供一些示例代码，展示如何使用矩阵在 WebGL 中实现旋转、平移和缩放。

// 创建旋转矩阵
const rotationMatrix = mat4.create();
mat4.rotate(rotationMatrix, rotationMatrix, Math.PI / 2, [0, 1, 0]);

// 创建平移矩阵
const translationMatrix = mat4.create();
mat4.translate(translationMatrix, translationMatrix, [1, 2, 3]);

// 创建缩放矩阵
const scaleMatrix = mat4.create();
mat4.scale(scaleMatrix, scaleMatrix, [2, 2, 2]);

// 组合变换
const combinedMatrix = mat4.create();
mat4.multiply(combinedMatrix, rotationMatrix, translationMatrix);
mat4.multiply(combinedMatrix, combinedMatrix, scaleMatrix);

这些示例只是 3D 数学在 WebGL 游戏开发中的众多应用中的几个。掌握这些基本概念将为你解锁无限的可能性，让你创建引人入胜的 3D 世界和令人难忘的游戏体验。