Assume I have this $5 \times 5$ grid with a red point on it. The position of the point relative to the top left corner ($x$ axis has "right" direction as positive, $y$ axis has "down" direction as positive) is $(2,3)$.

Now let's say I resize this grid to $10 \times 10$. I want the point to be dependant on the $5 \times 5$ grids point. So the new position, in the $10 \times 10$ grid, of the point should be $(2 \cdot 2, 3 \cdot 2)$ since I doubled the width and height of the new grid.

My question is, how do I figure out the new position in a grid with a more difficult grid size (in this case, that isn't a multiple of $5$) eg: in a $27 \times 27$ grid.

What would be the algorithm to figure out the new coordinates of the point ?

  • $\begingroup$ What should be exactly the properties of your map from the $10\times 10$ grid to $27 \times 27$? What do you want to preserve? $\endgroup$ – md5 Jan 6 '17 at 13:59
  • $\begingroup$ I'll try to explain in simpler, non-mathematical terms as I'm not too fluent with the english language. If my point in the 10x10 grid appears "a bit to the left from the center" (just like in my 5x5 grid image) I want it to appear "a bit to the left from the center" when I resize the grid to 27x27 $\endgroup$ – P. Ktinos Jan 6 '17 at 14:03
  • $\begingroup$ You can just round to the nearest integer. For example, $\frac{27}{5}(2,3)=(10.8, 16.2) \approx (11, 16)$. You could also experiment with the ceiling and floor function to see what looks best. Ceiling: $\lceil 10.8 \rceil = 11$, Floor: $\lfloor 10.8 \rfloor = 10$, Round: $round(10.8)=\lfloor 10.8+0.5\rfloor = 11$. $Round(x) = \lfloor x + 0.5 \rfloor$. $\endgroup$ – Michael Jan 6 '17 at 14:12
  • $\begingroup$ How about a non-square shape? Eg what if I want my new grid to be (27,26) ? $\endgroup$ – P. Ktinos Jan 6 '17 at 14:14
  • $\begingroup$ Just multiply each coordinate by the scaling factor you want. Use $\frac{27}{5}$ for the first and $\frac{26}{5}$ for the second. $\endgroup$ – Michael Jan 6 '17 at 14:16

The easiest way is to just round to the nearest integer: $$ (2,3) \rightarrow \frac{27}{5}(2,3) = (10.8, 16.2) \approx (11, 16) $$ For separate scale factors $s_1, s_2$ you can do: $$ (2,3) \rightarrow (s_1 2, s_2 3) \approx (round(s_12), round(s_2 3)) $$ For example, if $s_1 = 27/5$, $s_2 = 26/5$ then: \begin{align} &(s_12, s_23) =(10.8, 15.6) \\ &(round(s_12), round(s_23)) = (11, 16) \end{align} You can also play around by replacing "round" with "floor" or "ceiling" to see what looks best. For imaging applications, you can also consider averaging with the pixel values around you. You can also shift the mapping a bit depending on what pixel you want to be invariant. For example, this $(a,b) \rightarrow (round(s_1 a), round(s_2 b))$ mapping always maps the bottom right corner to the bottom right corner.

| cite | improve this answer | |
  • $\begingroup$ For actual image resizing applications, you need to do more than this: You will find that this leaves many blank pixels, and the dot will not be resized (just relocated). Instead of imagining "pushing" the image to a larger one, it is better to imagine "pulling" the image from the smaller one. So each new location $(i,j)$ must be filled by a pixel value via an inverse mapping from the original. $\endgroup$ – Michael Jan 6 '17 at 14:50

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.