这是一个单文件HTML解决方案。它使用Three.js库构建了一个3D场景,包含一个由几何体(盒子)拼装成的体素风格鹈鹕,骑着一辆自行车在地面上行驶。 ### 代码说明: 1. **Three.js 基础**:设置了场景、相机、渲染器和光照(包括产生阴影的平行光)。 2. **体素建模**:鹈鹕和自行车都是通过基础几何体(主要是 `BoxGeometry` 和 `CylinderGeometry`)组合而成的。我通过父子层级关系(Group)来管理它们,方便整体移动。 3. **动画逻辑**: * **车轮转动**:在渲染循环中旋转车轮。 * **蹬车动作**:简单的腿部和踏板旋转动画。 * **整体移动**:鹈鹕和自行车在一个巨大的圆形路径上移动。 4. **环境**:包含一个棋盘格纹理的地面和淡蓝色的天空背景。 你可以直接将以下代码保存为 `.html` 文件(例如 `pelican_bike.html`),然后在浏览器中打开。 ```html 3D Voxel Pelican on Bicycle
3D 鹈鹕骑行演示 (Three.js)
```