Mathematics Stack Exchange is a question and answer site for people studying math at any level and professionals in related fields. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

This should be simple but my math skills are really bad ...

I have an image of 36 images (6 by 6 matrix). These small images are 36 instances of a direction arrow (like from Google maps GPS), each image rotated by $10^\circ$ from $0^\circ$ to $350^\circ$.

I don't know how to get image $X$ and $Y$ position of each small image when I have the rotation amount. Images are $50\times50\,\mathrm{px}$, so...

  • for $10^\circ$ image is at $50\times0\,\mathrm{px}$,
  • for $20^\circ$ image is at $100\times0\,\mathrm{px}$
  • for $90^\circ$ image is at $150\times50\,\mathrm{px}$ (because it is on row 2)
  • ...
  • for $350^\circ$ image is at $250\times250\,\mathrm{px}$

What is the formula to get this $X-Y$ value?

enter image description here

share|cite|improve this question

Given that the angle of the $n$th image is $n\cdot10^\circ$ for $n=0,1,\dots,35$, you can have the $y$-index $j$ to be $\lfloor{n/6}\rfloor$ (int part of $n/6$) and the $x$-index $i$ to be $n-6j$.

You then multiply $i$ and $j$ for the respective $\Delta x$ and $\Delta j$ which in your problem is $50\,\mathrm{px}$ each. \begin{align} j &= \lfloor{n/6}\rfloor \\ i &= n-6j \\ x &=i\cdot50\,\mathrm{px} \\ y &=j\cdot50\,\mathrm{px} \end{align}

Programaticaly (this will be pseudocode, but you might be able to adapt to your language of choice):

for n = 0 to 35:
    j = n div 6
    i = n mod 6
    draw( rotate(figure,10*n), i*50, j*50 )

Where n div 6 means integer division (quotient from integer division) and n mod 6 means modulo operator (residue from integer division). In C and other C-inspired language they are respectively n/6 and n%6. Language with no strong integer classes you might need to write j = int(n/6) and i=n-6*j .

share|cite|improve this answer
That's probably right but looks complicated for me to understand, I guess my math knowledge is just absurdly low. I made it with a different code and I posted it as answer. Thanks. I was using PHP language btw. – adrianTNT Dec 14 '13 at 1:51

Should be something like X=(degrees mod 60)*5, Y=(degrees div 60)*50

share|cite|improve this answer
X=(degrees mod 60)*5, as the degrees are already multiplied by 10. – Carlos Eugenio Thompson Pinzón Dec 13 '13 at 20:37
yes, you're right. I'll update the answer. – wxyz Dec 13 '13 at 20:42
I couldn't get this to work, but probably because I had to do it by PHP and I am not sure I found the right mathematic equivalent. degrees mod 60 I assumed it was $degrees % 60, I don't know if that's right. Anyway, I was able to do it by a few different steps. Thanks. – adrianTNT Dec 14 '13 at 1:35

I was able to do it by this PHP code, calculating row and column number:

$box_number = floor($angle/10);
$row_number = floor($box_number/6);
$col_number = $box_number-(floor($box_number/6)*6);

$image_x = 50*$col_number;
$image_y =  50*$row_number;

Just that at the end I had to manually force the value of 360° to be the same as (0x0px)

share|cite|improve this answer
Note that you can write $col_number = $box_number-($row_number*6); as you already have calculated floor($box_number/6). – Carlos Eugenio Thompson Pinzón Dec 14 '13 at 3:03

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

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