A three.js visualisation of solving a Rubik's cube.
Currently, I have not implemented the solving part. Instead, I am cheating by using a reversed list of opposite moves as the solution.
The following query params can be added:
| Query Param | Description | Values | Default |
|---|---|---|---|
| cubeSize | The size of the cube | 2-5 | 3 |
| animationSpeed | How quickly to animate the moves | 100-5000 ms | 750 ms |
| autoRotate | Auto rotate the cube as it is solving | bool | true |
| autoRotateSpeed | Speed of auto rotatation (if enabled) | 0-10000 ms | 1000 ms |
| axesEnabled | Draw the X, Y and Z axes | bool | false |
- https://taylorjg.github.io/rubiks-cube?animationSpeed=250
- https://taylorjg.github.io/rubiks-cube?animationSpeed=250&cubeSize=2
- https://taylorjg.github.io/rubiks-cube?animationSpeed=250&cubeSize=4
- https://taylorjg.github.io/rubiks-cube?animationSpeed=250&cubeSize=4&axesEnabled
Improve the look of the cube piecesAdd a slide-out panel to configure the size, speed etc- Implement an algorithm to solve the cube properly