Web学员作品-手玩魔方项目

1. 手玩魔方项目背景

Pc端app移动端均可使用，平时喜欢玩魔方的同学们设计，一个魔方太大不玩是没有地方放，这个可以在手机里玩，平时拿出手机就可以使用。

2. 思路：(要实现魔方六个面以及九个小块的样式并旋转展示。)

内容部分：魔方分为六个面，每个面有九个小块，使用一个div内嵌套六个div再嵌套九个div实现内容部分(一个方法来控制div数量，可以增加和减少每面的小方格数量)。

样式部分：最外层div设置属性 transform-style: preserve-3d;实现整体的3D效果。

内部六个面使用 transform: rotateX/Y/Z(0deg) translateZ(1px); 分别平移旋转不同的角度，与第一个面组成立方体。

设置每个面九个小块的大小和边框样式(圆角)以及背景颜色。

最后设置整体的旋转方式以及循环时间等。

3. 完成功能

双击开始、计时器、canvas画图、随机旋转、鼠标点击旋转

4. 应用框架

threejs组件分别是相机(Camera)、渲染器(Renderer)和场景(Scene)，这三个组件是创建3D图形的必备组件。