【15】实战——物体的缩放与旋转

文章摘要

本文介绍了如何使用Three.js库和Vue框架设置一个立方体的缩放和旋转。

主要步骤包括：

• 创建场景。
• 初始化一个透视摄像机，并设置其位置。
• 添加立方体几何体和材质，设置立方体的缩放和旋转。
• 初始化WebGL渲染器并设置尺寸，将渲染内容添加到DOM中。
• 创建轨道控制器以允许交互。
• 添加坐标轴辅助器以帮助可视化空间。

通过以上步骤，实现了立方体的基本设置。在渲染方法中，立方体在X轴上往返移动并绕X轴旋转。注意，为了避免请求动画帧(requestAnimationFrame)导致调用栈溢出的问题，使用.bind(this)确保正确的上下文。