共计 855 个字符，预计需要花费 3 分钟才能阅读完成。
这是今天分析的 demo，这是源码。
下面是要分析的内容：
1. 第一人称控制器
// 初始化第一人称控制器，类似 cs 等第一人称控制器
controls = new THREE.FirstPersonControls(camera);
// 相机的移动速度
controls.movementSpeed = 500;
// 鼠标移动查看速度
controls.lookSpeed = 0.1;
2. 初始化场景
// 设置背景颜色
scene.background = new THREE.Color(0xaaccff);
// 指定场景中的雾为指数雾，参数为雾的颜色和雾的密度会增长多快
scene.fog = new THREE.FogExp2(0xaaccff, 0.0007);
3. 设置时间相关的对象
// 初始化时间相关的对象
clock = new THREE.Clock();
// 每一帧的时间
var delta = clock.getDelta();
// 从开始到现在总共的时间
var time = clock.getElapsedTime() * 10;
4. 海浪的波动——海浪的波动实质是将平面翻转，通过平面宽度和高度分段数，将平面切成很多小片。
geometry = new THREE.PlaneBufferGeometry(20000, 20000, worldWidth – 1, worldDepth – 1);
geometry.rotateX(– Math.PI / 2);
小片的数量等于 worldWidth * worldDepth，遍历小片，以时间和小片序号为参数，计算小片在 y 轴的位置并设置。
// 获取物体的属性
var position = geometry.attributes.position;
// 控制波浪的波动, position.count = worldWidth * worldDepth
for (var i = 0; i < position.count; i ++) {
var y = 35 * Math.sin(i / 5 + ( time + i) / 7 );
position.setY(i, y);
}
position.needsUpdate = true;
