| Variables | |
| W | : Width of large container rectangle |
| H | : Height of large container rectangle |
| Wr | : Width of a rectangle in the rth stack of rectangles (the width of that stack) |
| Hr | : Height of a rectangle in the rth stack of rectangles |
| N | : Number of stacks of Rectangles |
| i | : Indexer of the summation notation used to loop through the N stacks |
| qi | : Quantity of rectangles in the ith stack of rectangles |
| Things to note | |
| 1. | Because the ith stack of similar rectangles are all the same width, they will all be the same height. So Hi = H/qi. Or H = qi*Hi |
| 2. | The width, W, is the sum of each of the stack widths, Wi. |
| 3. | There are different ways to write the equation, depending on what you want to discover. |
An Example
Suppose we designate an area that we want to fill with our similar rectangles in such a way that we have 5 stacks, with the counts of rectangles in each stack being, from left to right: 4, 7, 2, 3, 1.
So here is a rendering of the big rectangle area, containing the stacks of similar rectangles. As you look at the little rectangles, you can see how they are similar.
Using the variables, W=480 and H=270, q1=4, q2=7, q3=2, q4=3, q5=1, let's calculate the sizes of the rectangles in each column.
First, the inverse of the summation of the quantities in each stack is (1/4 + 1/7 + 1/2 + 1/3 + 1/1)-1 = ((21 + 12 + 42 + 28 + 84)/84)-1 = (187/84)-1 = 84/187 = 0.44919...
So how can we use this equation for a practical purpose?
Our product VPMixer uses this to create a particular type of slideshow.
The software accounts for the need to use integers for image sizes and also account for the desired border size around each image, but the SRE is the foundation.
Pretty cool, eh?
Suppose we designate an area that we want to fill with our similar rectangles in such a way that we have 5 stacks, with the counts of rectangles in each stack being, from left to right: 4, 7, 2, 3, 1.
So here is a rendering of the big rectangle area, containing the stacks of similar rectangles. As you look at the little rectangles, you can see how they are similar.
Using the variables, W=480 and H=270, q1=4, q2=7, q3=2, q4=3, q5=1, let's calculate the sizes of the rectangles in each column.
First, the inverse of the summation of the quantities in each stack is (1/4 + 1/7 + 1/2 + 1/3 + 1/1)-1 = ((21 + 12 + 42 + 28 + 84)/84)-1 = (187/84)-1 = 84/187 = 0.44919...
| Using that number we can calculate the height of each rectangle in each stack and then using the SRE, get the width: | ||
| Column 1: | H1 = H/q1 = 270/4 = 67.5 | W1 = (270/4)*(480/270)*(84/187) = 53.90... |
| Column 2: | H2 = H/q2 = 270/7 = 38.57... | W2 = (270/7)*(480/270)*(84/187) = 30.80... |
| Column 3: | H3 = H/q3 = 270/2 = 135 | W3 = (270/2)*(480/270)*(84/187) = 107.80... |
| Column 4: | H4 = H/q4 = 270/3 = 90 | W4 = (270/3)*(480/270)*(84/187) = 71.87... |
| Column 5: | H5 = H/q5 = 270/1 = 270 | W5 = (270/1)*(480/270)*(84/187) = 215.61... |
So how can we use this equation for a practical purpose?
Our product VPMixer uses this to create a particular type of slideshow.
The software accounts for the need to use integers for image sizes and also account for the desired border size around each image, but the SRE is the foundation.
Pretty cool, eh?