🎯 坐标系与空间变换
理解 Three.js 的坐标系统
📐 右手坐标系
Y (上)
↑
|
+-----→ X (右)
/
/
Z (前)
📊 当前物体变换
💡 核心概念
1. 变换三要素
• Position: 平移
• Rotation: 旋转（弧度）
• Scale: 缩放
2. 坐标系统
• 局部坐标：相对父物体
• 世界坐标：相对场景原点
3. 变换顺序
缩放 → 旋转 → 平移
⚠️ 观察：调整 GUI 参数，观察物体的变换效果！
🎮 操作说明
• 鼠标拖拽：旋转视角
• 鼠标滚轮：缩放
• 右键拖拽：平移
• GUI 面板：控制物体变换
📝 代码示例
// 平移
cube.position.set(5, 2, -3);
// 旋转（弧度）
cube.rotation.set(
Math.PI / 4, // X: 45°
Math.PI / 2, // Y: 90°
0 // Z: 0°
);
// 缩放
cube.scale.set(2, 2, 2);
// 看向目标
cube.lookAt(0, 0, 0);