Search code examples
c#geometrytrigonometryemgucv

Translate a point on a rotated image coordinates to container coordinates

I'm creating an application that tries to find three points in an image using EmguCV. Those three points are used to calculate the position of a numeric code that I want to show to the user. The aim is to help the user zooming and centering that code in order to permit the user to read it well and without effort. The code can be in different angles and is very important to rotate the image to show the code in the correct orientation.

I show the image inside an ScrollView. That I'm doing is scroll proportionally in X and Y to center the image over the code in relation to the center point of the code. It works well when I do that without rotating the image, but when I rotate the image I can't calculate the position of the code. To illustrate the problem I'll put two images.

Normal image with his code

In the image above, we can see a blue point representing de localisation of the center of the code. The green vector represents the vector from the origin of the image to the center of the code. In that case, the origin of the image and the origin of the container are the same, so I can zoom and center over the code without problems.

Rotated rectangle

To put the code oriented and readable I'll need to rotate approximately -120º the entire image. In the image above (2) the black square represents the image rotated -120º with its code point center (orange) and the vector indicating its origin (green). The big red square represents the container rectangle (a grid). The problem is that the point center that I calculated before with EmguCv has its origin in the point (0,0) of the image, when I rotate the image this origin (0,0) of the image is rotated too. So I want to calculate the code center point (orange point) in relation to the origin of the container (yellow vector) in order to scroll and center the image to spot over the code.

To calculate the point translation I use a Matrix and it works well for scale transform, but not for rotate transform due to the rotation of the point of origin.

You need to consider that cutting and extracting the code portion is not an option. Not always the OpenCv library can extract three points from the image and sometimes I can't calculate the position correctly so I need to permit the user to scroll over the image to find the code.

The image has 2448x2048 pixels, scale is X,Y 3.0 and rotation is near -120º.

Any suggestions?

Solution

  • So you have (x,y) coordinates, and what to find the (u,v) coordinates.

    A bit of geometry is helpful here. You know the original image size (w,h) and the rotation angle θ which is -120°. You are going to need the opposing angle β=180+θ (shown below) which brings the number down to the 0-90 range.

    fig1

    • The rotated image has size

      W = a+b = w*COS(β)+h*SIN(β)
H = d+c = w*SIN(β)+h*COS(β)

    • The target coordinates are now found by moving by seeing that the coordinate of the origin of the (x,y) coordinates is located at (W,c) relative to the new origin. From there the (x,y) vector is just rotated accordingly to get the new coordinates:

      u = W - y*SIN(β) - x*COS(β)
v = c - y*COS(β) + x*SIN(β)