# Getting $x,y$ position on an image based on given value

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?

-

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 )
next


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 .

-
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

-
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 0° (0x0px)

-
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