# Please lay me a hand.

This topic is 2542 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

## Recommended Posts

Hi. I've been trying to figure this out and I kind of can't.

I have an image that represents a character. By default, the character depicted in the image is standing and heading right. ( -> )

Then, inside the "game" the character has a velocity vector (x,y).

So, given this velocity vector I'm calculating an angle in the following way:

float radians = atan2(x_vel, y_vel);

So far, so good. A first problem was that when the velocity represents an angle of (180 CCW) the image gets upside-down. So what I did was to check if the x velocity was smaller than zero, and if it was, then I'd flip the image horizontally.

But now I can't figure out how to apply the rotation. I need a way to adjust the rotation that comes from atan2 depending on whether the image is heading left or right.

 coord (0,1) ?/2 ? ? <-heading left ? heading right -> ? ? ? ? coord (-1,0) ? ???????????????????????????????? 0 or 2? coord (1,0) ? ? ? ? ? ? 3/4? coord (0,-1)

##### Share on other sites

Hi. I've been trying to figure this out and I kind of can't.

I have an image that represents a character. By default, the character depicted in the image is standing and heading right. ( -> )

Then, inside the "game" the character has a velocity vector (x,y).

So, given this velocity vector I'm calculating an angle in the following way:

float radians = atan2(x_vel, y_vel);

So far, so good. A first problem was that when the velocity represents an angle of (180 CCW) the image gets upside-down. So what I did was to check if the x velocity was smaller than zero, and if it was, then I'd flip the image horizontally.

But now I can't figure out how to apply the rotation. I need a way to adjust the rotation that comes from atan2 depending on whether the image is heading left or right.

 coord (0,1) ?/2 ? ? <-heading left ? heading right -> ? ? ? ? coord (-1,0) ? ???????????????????????????????? 0 or 2? coord (1,0) ? ? ? ? ? ? 3/4? coord (0,-1)

hmm wouldn't it work to rotate 0-(?-atan2(xvel,yvel) if xvel<0 ?(after flipping the image)

(Also , it should be 3/2? at 0,-1

##### Share on other sites

hmm wouldn't it work to rotate 0-(?-atan2(xvel,yvel) if xvel<0 ?(after flipping the image)

(Also , it should be 3/2? at 0,-1

Almost! With your tip the image gets well rotated when heading left, but when heading right (edit: or left) and going towards (x=1,y=1) or( x=-1,y=-1) (that is diagonally) the angle is flipped vertically (heading down when going up and the opposite).

here is the code I'm using to rotate the bitmap with your suggestion included:

[source lang="cpp"]
void rotate()
{
float radians = atan2(x_vel, y_vel); //0; //1.5708; //

if (x_vel<0)
{
}

int bmp_width = image.get_width();
int bmp_height = image.get_height();

float point1_x=(-bmp_height*sine);
float point1_y=(bmp_height*cosine);
float point2_x=(bmp_width*cosine-bmp_height*sine);
float point2_y=(bmp_height*cosine+bmp_width*sine);
float point3_x=(bmp_width*cosine);
float point3_y=(bmp_width*sine);

float minx=min(0,min(point1_x,min(point2_x,point3_x)));
float miny=min(0,min(point1_y,min(point2_y,point3_y)));
float maxx=max(point1_x,max(point2_x,point3_x));
float maxy=max(point1_y,max(point2_y,point3_y));

int dest_width=(int)ceil(fabs(maxx)-minx);
int dest_height=(int)ceil(fabs(maxy)-miny);

if (image_rotated.buffer.size()!= (uint32_t)dest_width*dest_height)
{
image_rotated.new_transparent(dest_width, dest_height);
}

for(int x=0;x<dest_width;x++)
{
for(int y=0;y<dest_height;y++)
{
int src_bitmap_x=(int)((x+minx)*cosine+(y+miny)*sine);
int src_bitmap_y=(int)((y+miny)*cosine-(x+minx)*sine);
if( src_bitmap_x>=0 && src_bitmap_x<image.get_width() && src_bitmap_y>=0 && src_bitmap_y<image.get_height() )
{
image_rotated.buffer[y * image_rotated.get_width() + x] = image.buffer[src_bitmap_x * image.get_width() + src_bitmap_y];
}
}
}
}[/source]

##### Share on other sites

[quote name='SimonForsman' timestamp='1307402192' post='4820291']
hmm wouldn't it work to rotate 0-(?-atan2(xvel,yvel) if xvel<0 ?(after flipping the image)

(Also , it should be 3/2? at 0,-1

Almost! With your tip the image gets well rotated when heading left, but when heading right (edit: or left) and going towards (x=1,y=1) or( x=-1,y=-1) (that is diagonally) the angle is flipped vertically (heading down when going up and the opposite).

here is the code I'm using to rotate the bitmap with your suggestion included:

[source lang="cpp"]
void rotate()
{
float radians = atan2(x_vel, y_vel); //0; //1.5708; //

if (x_vel<0)
{
}

int bmp_width = image.get_width();
int bmp_height = image.get_height();

float point1_x=(-bmp_height*sine);
float point1_y=(bmp_height*cosine);
float point2_x=(bmp_width*cosine-bmp_height*sine);
float point2_y=(bmp_height*cosine+bmp_width*sine);
float point3_x=(bmp_width*cosine);
float point3_y=(bmp_width*sine);

float minx=min(0,min(point1_x,min(point2_x,point3_x)));
float miny=min(0,min(point1_y,min(point2_y,point3_y)));
float maxx=max(point1_x,max(point2_x,point3_x));
float maxy=max(point1_y,max(point2_y,point3_y));

int dest_width=(int)ceil(fabs(maxx)-minx);
int dest_height=(int)ceil(fabs(maxy)-miny);

if (image_rotated.buffer.size()!= (uint32_t)dest_width*dest_height)
{
image_rotated.new_transparent(dest_width, dest_height);
}

for(int x=0;x<dest_width;x++)
{
for(int y=0;y<dest_height;y++)
{
int src_bitmap_x=(int)((x+minx)*cosine+(y+miny)*sine);
int src_bitmap_y=(int)((y+miny)*cosine-(x+minx)*sine);
if( src_bitmap_x>=0 && src_bitmap_x<image.get_width() && src_bitmap_y>=0 && src_bitmap_y<image.get_height() )
{
image_rotated.buffer[y * image_rotated.get_width() + x] = image.buffer[src_bitmap_x * image.get_width() + src_bitmap_y];
}
}
}
}[/source]
[/quote]

Hmm, if you get things wrong when heading right aswell then the problem shouldn't be with the code i added (as it only applies when facing left) but rather with the rest of the rotation code.

I'm having a hard time wrapping my head around that at the moment though. (lots of math, might need a pen and paper for this)

##### Share on other sites

Hmm, if you get things wrong when heading right aswell then the problem shouldn't be with the code i added (as it only applies when facing left) but rather with the rest of the rotation code.

I'm having a hard time wrapping my head around that at the moment though. (lots of math, might need a pen and paper for this)

Without flipping the image horizontally nor negating the angle in relation the the velocity:

- Originally the image is heading right:

- When the angle is 0 it gets rotated so it looks straight down
- When the angle is ?/2 (1.5708) it ends up looking straight to the right (like if it was horizontally flipped)
- When the angle is (3/2)*3.1416 it looks straight up
- When the angle is 3.1416 it looks straight up too! wtf?

Shouldn't I rotate it only a max of 180º when if flip it first? I mean, to avoid having it rotated 360º.

##### Share on other sites
float radians = atan2(x_vel, y_vel);[/quote]
Assuming you're using standard conventions (which it sounds like you are), the above should probably be:

float radians = atan2(y_vel, x_vel);

##### Share on other sites

float radians = atan2(x_vel, y_vel);

Assuming you're using standard conventions (which it sounds like you are), the above should probably be:

float radians = atan2(y_vel, x_vel);
[/quote]

You're right about that. Yet, ironically, doing it the right way brings worst results! Now the image never faces the direction it's going! What's going on? O_o

##### Share on other sites

You're right about that. Yet, ironically, doing it the right way brings worst results! Now the image never faces the direction it's going! What's going on? O_o

Do you still have any of the 'corrective' code in place? That is, are you modifying the angle returned by atan2() in any way?

Also, although this is probably too obvious, are you missing any degrees<->radians conversions anywhere?

##### Share on other sites

[quote name='owl' timestamp='1307413592' post='4820346']
You're right about that. Yet, ironically, doing it the right way brings worst results! Now the image never faces the direction it's going! What's going on? O_o

Do you still have any of the 'corrective' code in place? That is, are you modifying the angle returned by atan2() in any way?

Also, although this is probably too obvious, are you missing any degrees<->radians conversions anywhere?
[/quote]

Yes, correcting the order of the parameters in the atan2 function, the code that rotates the image is *exactly* this one:

[source lang="cpp"]void rotate()
{
float radians = atan2(y_vel, x_vel); //0; //1.5708; //

if (x_vel<0)
{
}

int bmp_width = image.get_width();
int bmp_height = image.get_height();

float point1_x=(-bmp_height*sine);
float point1_y=(bmp_height*cosine);
float point2_x=(bmp_width*cosine-bmp_height*sine);
float point2_y=(bmp_height*cosine+bmp_width*sine);
float point3_x=(bmp_width*cosine);
float point3_y=(bmp_width*sine);

float minx=min(0,min(point1_x,min(point2_x,point3_x)));
float miny=min(0,min(point1_y,min(point2_y,point3_y)));
float maxx=max(point1_x,max(point2_x,point3_x));
float maxy=max(point1_y,max(point2_y,point3_y));

int dest_width=(int)ceil(fabs(maxx)-minx);
int dest_height=(int)ceil(fabs(maxy)-miny);

if (image_rotated.buffer.size()!= (uint32_t)dest_width*dest_height)
{
image_rotated.new_transparent(dest_width, dest_height);
}

for(int x=0;x<dest_width;x++)
{
for(int y=0;y<dest_height;y++)
{
int src_bitmap_x=(int)((x+minx)*cosine+(y+miny)*sine);
int src_bitmap_y=(int)((y+miny)*cosine-(x+minx)*sine);
if( src_bitmap_x>=0 && src_bitmap_x<image.get_width() && src_bitmap_y>=0 && src_bitmap_y<image.get_height() )
{
image_rotated.buffer[y * image_rotated.get_width() + x] = image.buffer[src_bitmap_x * image.get_width() + src_bitmap_y];
}
}
}
}[/source]

Given that code, now the image never faces towards the direction it's going... I still think I should cap the rotation to 180º if I flip the image before rotating it. Yet I'm not sure how to limit it... As far as I can tell everything seems to work in radians here... *blocked*

EDIT: If I change the order of the parameters in the atan2 function to be as they should (y, x) and I swap the sin and cos then it works exactly as having the atan2 function with the parameters as (x,y).

 float cosine=(float)sin(radians); float sine=(float)cos(radians);

##### Share on other sites

[quote name='jyk' timestamp='1307414032' post='4820350']
[quote name='owl' timestamp='1307413592' post='4820346']
You're right about that. Yet, ironically, doing it the right way brings worst results! Now the image never faces the direction it's going! What's going on? O_o

Do you still have any of the 'corrective' code in place? That is, are you modifying the angle returned by atan2() in any way?

Also, although this is probably too obvious, are you missing any degrees<->radians conversions anywhere?
[/quote]

Yes, correcting the order of the parameters in the atan2 function, the code that rotates the image is *exactly* this one:

[source lang="cpp"]void rotate()
{
float radians = atan2(y_vel, x_vel); //0; //1.5708; //

if (x_vel<0)
{
}

int bmp_width = image.get_width();
int bmp_height = image.get_height();

float point1_x=(-bmp_height*sine);
float point1_y=(bmp_height*cosine);
float point2_x=(bmp_width*cosine-bmp_height*sine);
float point2_y=(bmp_height*cosine+bmp_width*sine);
float point3_x=(bmp_width*cosine);
float point3_y=(bmp_width*sine);

float minx=min(0,min(point1_x,min(point2_x,point3_x)));
float miny=min(0,min(point1_y,min(point2_y,point3_y)));
float maxx=max(point1_x,max(point2_x,point3_x));
float maxy=max(point1_y,max(point2_y,point3_y));

int dest_width=(int)ceil(fabs(maxx)-minx);
int dest_height=(int)ceil(fabs(maxy)-miny);

if (image_rotated.buffer.size()!= (uint32_t)dest_width*dest_height)
{
image_rotated.new_transparent(dest_width, dest_height);
}

for(int x=0;x<dest_width;x++)
{
for(int y=0;y<dest_height;y++)
{
int src_bitmap_x=(int)((x+minx)*cosine+(y+miny)*sine);
int src_bitmap_y=(int)((y+miny)*cosine-(x+minx)*sine);
if( src_bitmap_x>=0 && src_bitmap_x<image.get_width() && src_bitmap_y>=0 && src_bitmap_y<image.get_height() )
{
image_rotated.buffer[y * image_rotated.get_width() + x] = image.buffer[src_bitmap_x * image.get_width() + src_bitmap_y];
}
}
}
}[/source]

Given that code, now the image never faces towards the direction it's going... I still think I should cap the rotation to 180º if I flip the image before rotating it. Yet I'm not sure how to limit it... As far as I can tell everything seems to work in radians here... *blocked*

EDIT: If I change the order of the parameters in the atan2 function to be as they should (y, x) and I swap the sin and cos then it works exactly as having the atan2 function with the parameters as (x,y).

 float cosine=(float)sin(radians); float sine=(float)cos(radians);

[/quote]

You shouldn't need to cap the rotation, xvel<0 should always result in a rotation between pi/2 and 3pi/2 (90-270 degrees) while xvel > 0 results in one that is either between 0 and pi/2(0-90 degrees) or between 3pi/2 and 2pi (270-360 degrees)

The fact that your image gets rotated at all when the angle is 0 means that you've messed up your rotation formula. (when radians is 0 there should be no rotation)

//some mindless typing to help me keep my mind on track, possible conclusion further down.

sin(0) = 0
cos(0) = 1

Thus your 3 points when you're not supposed to rotate anything becomes:

float point1_x=0;float point1_y=bmp_height;

float point2_x=bmp_width;float point2_y=bmp_height;
float point3_x=bmp_width;float point3_y=0;

then:

float minx=min(0,min(point1_x,min(point2_x,point3_x)));float miny=min(0,min(point1_y,min(point2_y,point3_y)));float maxx=max(point1_x,max(point2_x,point3_x));float maxy=max(point1_y,max(point2_y,point3_y));

minx = 0
miny = 0
maxx = bmp_width
maxy = bmp_height

//Image size doesn't change atleast.

Then for each pixel in the rotated image you do
 int src_bitmap_x=(int)((x+0)); int src_bitmap_y=(int)((y+0)); if( src_bitmap_x>=0 && src_bitmap_x<image.get_width() && src_bitmap_y>=0 && src_bitmap_y<image.get_height() ) { image_rotated.buffer[y * image_rotated.get_width() + x] = image.buffer[src_bitmap_x * image.get_width() + src_bitmap_y]; } 
shouldn't:
image_rotated.buffer[y * image_rotated.get_width() + x] = image.buffer[src_bitmap_x * image.get_width() + src_bitmap_y];

be

image_rotated.buffer[y * image_rotated.get_width() + x] = image.buffer[src_bitmap_y * image.get_width() + src_bitmap_x];

• 9
• 9
• 13
• 41
• 15
×

## Important Information

Participate in the game development conversation and more when you create an account on GameDev.net!

Sign me up!