The visualizer is mainly built with @react-three/fiber and @react-three/drei.
You can find a deployed version of this visualizer at https://lotuc.org/bin-pack/.
It supports two kind of input, eb-afit input and eb-afit visualdot. You can
change the packedBoxes number (-1 shows all packed, 0 shows none, 1, shows
first packed, and so on) to replay the packing process.
The input text format is defined in the original paper, and you can find more sample data here.
In the first line, the three numbers are the x, y, and z dimensions of the pallet. All subsequent lines contain box information. In each line,the first number is the box label. The second, third, and fourth numbers are the x, y, and z dimensions of each box type, respectively. The fifth number represents the number of boxes of the sametype.
Since the algorithm tries all orientations, all of the dimensions' order has no importance.
Here is a sample:
104, 96, 84
1. 70, 104, 24, 4
2. 14, 104, 48, 2
3. 40, 52, 36, 3
The first line is the pallet dimensions, the rest lines are box's coordinates and their dimensions.
Here is a sample:
104 96 84
0 0 0 104 24 70
0 0 70 104 48 14
0 24 0 104 24 70
0 48 0 104 24 70
0 48 70 104 48 14
0 72 0 104 24 70