3

I have the x, y co-ordinates of a point on a rotated image by certain angle. I want to find the co-ordinates of the same point in the original, non-rotated image.

Please check the first image which is simpler:

UPDATED image, SIMPLIFIED: Simplified description

OLD image: enter image description here

Rutwick Gangurde
  • 4,772
  • 11
  • 53
  • 87

2 Answers2

0

Let's say the first point is A, the second is B and the last is C. I assume you have the rotation matrice R (see Wikipedia Rotation Matrix if not) et the translation vector t, so that B = R*A and C = B+t. It comes C = R*A + t, and so A = R^1*(C-t).

Edit: If you only need the non rotated new point, simply do D = R^-1*C.

Cyril
  • 559
  • 5
  • 17
  • Thanks man, but I'm not using a rotation matrix! Instead using some trig formulas... – Rutwick Gangurde Jun 19 '13 at 02:15
  • In that case we need some more information : where is the center of the rotation ? Is it (0,0) ? I have the impression that your coordinate system changes during the rotation (A->B). – Cyril Jun 19 '13 at 07:12
  • Yes... the image rotates around the center. The x, y positions are calculated from the left, top resp. since its in a browser based environment. When the image rotates, the frame expands to keep the image intact, meaning to avoid cutting any corners of the images. Hence the x, y pos. of the point are affected! – Rutwick Gangurde Jun 19 '13 at 07:21
0

First thing to do is defining the reference system (how "where the points lies with respect to each image" will be translated into numbers). I guess that you want to rely on a basic 2D reference system, given by a single point (a couple of X/Y values). For example: left/lower corner (min. X and min. Y).

The algorithm is pretty straightforward:

  1. Getting the new defining reference point associated with the rotated shape (min. X and min. Y), that is, determining RefX_new and RefY_new.

  2. Applying a basic conversion between reference systems:
    X_old = X_new + (RefX_new - RefX_old)
    Y_old = Y_new + (RefY_new - RefY_old)

----------------- UPDATE TO RELATE FORMULAE TO NEW CAR PIC

RefX_old = min X value of the CarFrame before being rotated.

RefY_old = max Y value of the CarFrame before being rotated.

RefX_new = min X value of the CarFrame after being rotated.

RefY_new = max Y value of the CarFrame after being rotated.

X_new = X of the point with respect to the CarFrame after being rotated. For example: if RefX_new = 5 with respect to absolute frame (0,0) and X of the point with respect to this absolute frame is 8, X_new would be 3.

Y_new = Y of the point with respect to CarFrame after being rotated (equivalently to point above)


X_old_C = X_new_C(respect to CarFrame) + (RefX_new(CarFrame_C) - RefX_old(CarFrame_A))

Y_old_C = Y_new_C(respect to CarFrame) + (RefY_new(CarFrame_C) - RefY_old(CarFrame_A))


These coordinates are respect to the CarFrame and thus you might have to update them with respect to the absolute frame (0,0, I guess), as explained above, that is:

X_old_D_absolute_frame = X_old_C + (RefX_new(CarFrame_C) + RefX_global(i.e., 0))

Y_old_D_absolute_frame = Y_old_C + (RefY_new(CarFrame_C) + RefY_global(i.e., 0))

(Although you should do that once the CarFrame is in its "definitive position" with respect to the global frame, that is, on picture D (the point has the same coordinates with respect to the CarFrame in both picture C and D, but different ones with respect to the global frame).)

It might seem a bit complex put in this way; but it is really simple. You have just to think carefully about one case and create the algorithm performing all the actions. The idea is extremely simple: if I am on 8 inside something which starts in 5; I am on 3 with respect to the container.

------------ UPDATE IN THE METHODOLOGY

As said in the comment, these last pictures prove that the originally-proposed calculation of reference (max. Y/min. X) is not right: it shouldn't be the max./min. values of the carFrame but the minimum distances to the closer sides (= perpendicular line from the left/bottom side to the point).

------------ TRIGONOMETRIC CALCS FOR THE SPECIFIC EXAMPLE

The algorithm proposed is the one you should apply in any situation. Although in this specific case, the most difficult part is not moving from one reference system to the other, but defining the reference point in the rotated system. Once this is done, the application to the non-rotated case is immediate.

Here you have some calcs to perform this action (I have done it pretty quickly, thus better take it as an orientation and do it by your own); also I have only considered the case in the pictures, that is, rotation over the left/bottom point:

X_rotated = dx * Cos(alpha)

where dx = X_orig - (max_Y_CarFrame - Y_Orig) * Tan(alpha)

Y_rotated = dy * Cos(alpha)

where dy = Y_orig - X_orig * Tan(alpha)

NOTE: (max_Y_CarFrame - Y_Orig) in dx and X_orig in dy expect that the basic reference system is 0,0 (min. X and min. Y). If this is not the case, you would have to change this variables.

The X_rotated and Y_rotated give the perpendicular distance from the point to the closest side of the carFrame (respectively, left and bottom side). By applying these formulae (I insist: analyse them carefully), you get the X_old_D_absolute_frame/Y_old_D_absolute_frame that is, you have just to add the lef/bottom values from the carFrame (if it is located in 0,0, these would be the final values).

varocarbas
  • 12,354
  • 4
  • 26
  • 37
  • How would I set and use a reference system in a browser based environment? The points x, y co-ords are measured from the left, top resp. – Rutwick Gangurde Jun 24 '13 at 10:56
  • There you have your reference system. The reference coords for each element will be the minimum X and maximun Y values for the given shape. There are different ways to get this depending upon the programming language, in .NET it is done through the properties .left and .top. Which language are you using? – varocarbas Jun 24 '13 at 11:13
  • JavaScript for the win! The problem is after 1 level of rotation the image expands (rotate a square by 45 degs and it's w/h expands), thus expanding the outer frame, which disturbs my reference system! – Rutwick Gangurde Jun 24 '13 at 11:44
  • That's why in the step 1 I said "Getting the new defining reference point"; you have to get the new min. X, max. Y for the container after the rotation. Here you have some help to do it: http://stackoverflow.com/questions/288699/get-the-position-of-a-div-span-tag – varocarbas Jun 24 '13 at 12:02
  • I tried reducing the new offset from the new x/y co-ords, but no luck, I still can't map the exact values on my original un-rotated image. I may be doing something wrong. Hence I'm adding a more clear use case image in my question summary, please tell me how the reference method you're describing will work here. – Rutwick Gangurde Jun 25 '13 at 09:45
  • I explained the idea with the example. Although this does not apply blindly to your example because the min. X/max. Y does not provide the right refence for the point. You would have to determine the the actually valid reference point, that is, the X/Y values of the (car) frame closest to the point (down/left size). – varocarbas Jun 25 '13 at 10:21
  • I'm gonna try this, because this could be my only solution right now! Just one doubt, I'm confused with X_min/Y_min, I mean I just have the x, y values. What's min or max? – Rutwick Gangurde Jun 25 '13 at 10:36
  • I meant the min. X and max. Y of the given frame; but as per my update, the right references are given by the perpendicular distance from the point to the lower line of the carPanel (or to the upper one, in case of referring to Max Y) and to the left one. If you need more explanations, I would give you a more detailed answer in some hours; now I have something else to do. – varocarbas Jun 25 '13 at 10:47
  • I have updated my reply with what is more relevant in the specific example you propose (trig calcs to determine the perpendicular distance to the closest point). Hope it helps. – varocarbas Jun 26 '13 at 08:22
  • I tried using the reference system. Could not get what global x, y means. I'll try the trig method you've stated in your latest update. But I've also added an updated image, which I believe is the simplest way to describe what I'm trying. Apologies for so much trouble and thanks for the help! – Rutwick Gangurde Jun 26 '13 at 09:45
  • Global X/Y refers to what contains the carPic; I guess that in your case is the global references for the page (0,0). Sorry for having been so generic but I wasn't sure how variable are the possible situations. The trig calcs are just an application to your case of the generic method and should work fine for all the examples you have included so far. – varocarbas Jun 26 '13 at 09:48
  • Dude, I might be implementing it wrong, but it ain't working! But I found a way to find the perpendicular distance from the point to the nearest edge and I think it will solve my problem. – Rutwick Gangurde Jun 27 '13 at 14:15
  • This is precisely what the last code I sent you is doing; but if you found another way, use it; this is the key for your problem. – varocarbas Jun 27 '13 at 14:24