README
Cube Preview
Contents
Installation
yarn add cube-preview
# or
npm install cube-preview
Usage
Basic Usage
CJS
const CubePreview = require('cube-preview');
const threeBythree = new CubePreview().svgString('RBLUULUBFRBDBRRBRFFDDFFRLFDBULDDFDLRURLLLDBLUFUBDBUUFR');
console.log(threeBythree);
Browser
<script src="cube-preview/bundle.min.js"></script>
<script>
var threeBythree = new CubePreview().svgString('RBLUULUBFRBDBRRBRFFDDFFRLFDBULDDFDLRURLLLDBLUFUBDBUUFR');
console.log(threeBythree);
</script>
The state of the cube must be in the form
'UUUUUUUUUR...F...D...L...B...'
// or
[0, 0, 0, 0, 0, 0, 0, 0, 0, 1, ..., 2, ..., 3, ..., 4, ..., 5]
The string consists of 54 characters, 9 per face:
U
means a facelet of the up face color, R
means a facelet of the right face color, etc.
The following diagram demonstrates the order of the facelets:
+------------+
| U1 U2 U3 |
| |
| U4 U5 U6 |
| |
| U7 U8 U9 |
+------------+------------+------------+------------+
| L1 L2 L3 | F1 F2 F3 | R1 R2 R3 | B1 B2 B3 |
| | | | |
| L4 L5 L6 | F4 F5 F6 | R4 R5 R6 | B4 B5 B6 |
| | | | |
| L7 L8 L9 | F7 F8 F9 | R7 R8 R9 | B7 B8 B9 |
+------------+------------+------------+------------+
| D1 D2 D3 |
| |
| D4 D5 D6 |
| |
| D7 D8 D9 |
+------------+
Advanced usage
setType
Set the type of puzzle to be drawn. Default is 333.
const twoByTwo = new CubePreview().setType('222').svgString('RDRBFRDFULBLDFUFBULURLBD');
console.log(twoByTwo);
Pyraminx
const pyraminx = new CubePreview().setType('pyram').svgString([2, 3, 1, 1, 1, 2, 0, 0, 2, 0, 3, 3, 1, 1, 0, 2, 2, 0, 1, 1, 1, 3, 3, 3, 3, 1, 2, 0, 0, 2, 2, 3, 0, 2, 3, 0,]);
console.log(pyraminx);
Megaminx Last Layer
const megaLL = new CubePreview()
.setType('minx')
.svgString([
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
1,
1,
3,
4,
2,
1,
2,
3,
2,
3,
4,
4,
5,
5,
5,
]);
console.log(megaLL);
setColorScheme
Set a custom color scheme. You only need to supply the colors you want to change.
const colored = new CubePreview()
.setColorScheme({
U: 'Black',
R: 'Pink',
F: '#39FF5A',
B: 'DeepSkyBlue',
})
.svgString('RBLUULUBFRBDBRRBRFFDDFFRLFDBULDDFDLRURLLLDBLUFUBDBUUFR');
console.log(colored);
The default color scheme :
defaultColorScheme = {
U: 'white',
R: 'red',
F: 'green',
D: 'yellow',
L: 'orange',
B: 'blue',
};
Status
Works for cubes from 2x2x2 to 7x7x7, pyraminx and megaminx LL.
Only output svg strings.