Hi guys! I'm working on some basic stuff to learn coding. Here is what I currently got, using a nested
for loop to draw a line from the a center point(x-, x+). I want to be able to rotate the line from the center point axle. Drawing new lines as a animation from the center point and outwards.
// I need this to draw a line out from the center point, left and right. I'm not 100% that I did this correctly. putpixel(x,y); px1=50,px2=100,py1=50,py2=not used atm. Later I will tackle all angles.
This should draw a line from x 50 to x 1 and x 50 to x 100 at the y location of 50.
cpx = px2-px1; // centerpoint/distance
for (int i=0; i<cpx; i++) {
putpixel();
px1--;
for (int y=0; y<cpx; y++) {
putpixel();
px2=px1;
px2++;
}
}
Here is my normal draw a line code:
for (int i=0; i<px2-px1; i++) {
putpixel();
px1++;
}
Am I on the right track here or just dumb?
Thanks!
Line function and rotate.
-
- Posts: 4373
- Joined: February 28th, 2013, 3:23 am
- Location: Oklahoma, United States
Re: Line function and rotate.
Could you perhaps format the code to be more like what you are actually using?
For instance, your PutPixel calls don't include the X, Y coordinates, so I'm not sure how to follow the code. Also, in the editor when creating the post, surround your code with the[/code] tags by highlighting your code in the Full Editor and clicking on Code. This way it's not all scrunched up against the left side of the post.
BUT, when drawing a line use the " slope intercept " formula. Chili actually goes over this in his old beginner series I think around episode 9 or 10, can't remember which exactly. Let's say your line goes from {0, 0} to { 50, 10 }. This means that for every 5 pixels drawn in the X direction, you need to drop down 1 pixel in the Y direction, but if you do { 0, 0 } to { 10, 50 } for every 1 pixel in the X direction you need to drop down 5 in the Y direction. So you need to have the line drawing function determine how to handle this as you don't want to actually drop down 5 pixels without drawing the pixels in between, and same for the X distance being greater than the Y distance.
As for rotation, you would use the sin and cos functions by passing in an angle in radians and multiplying the result by the distance to the end points in either direction. Normally, rotations are counter clockwise in math, but because the screen coordinates in the Y axis go from top to bottom, rotations are clockwise.
For instance, your PutPixel calls don't include the X, Y coordinates, so I'm not sure how to follow the code. Also, in the editor when creating the post, surround your code with the
Code: Select all
[code]
BUT, when drawing a line use the " slope intercept " formula. Chili actually goes over this in his old beginner series I think around episode 9 or 10, can't remember which exactly. Let's say your line goes from {0, 0} to { 50, 10 }. This means that for every 5 pixels drawn in the X direction, you need to drop down 1 pixel in the Y direction, but if you do { 0, 0 } to { 10, 50 } for every 1 pixel in the X direction you need to drop down 5 in the Y direction. So you need to have the line drawing function determine how to handle this as you don't want to actually drop down 5 pixels without drawing the pixels in between, and same for the X distance being greater than the Y distance.
As for rotation, you would use the sin and cos functions by passing in an angle in radians and multiplying the result by the distance to the end points in either direction. Normally, rotations are counter clockwise in math, but because the screen coordinates in the Y axis go from top to bottom, rotations are clockwise.
If you think paging some data from disk into RAM is slow, try paging it into a simian cerebrum over a pair of optical nerves. - gameprogrammingpatterns.com
Re: Line function and rotate.
Ah, sorry pasted it totally wrong and missed to say I have a problem with this code as it does not work as I intended. It draws a line from a Center Point to the left (-x). Check!
The second line does not draw as intended.
The problem I have is that it continues to draw the line off the screen. I will try to reverse the code, drawing the second line first.
The second line does not draw as intended.
Code: Select all
float px1=50;
float py1=25;
float px2=100;
float py2=50;
float cpx=px2-px1; // Center Point / Distance between point A-B.
for (int i=0; i<cpx; i++) {
putPixel(px1,py1);
px1--;
}
for (int i=0; i<cpx; i++) {
putPixel(px2-cpx,py1);
px2++;
}
}
Last edited by freqit on March 8th, 2017, 4:20 pm, edited 3 times in total.
Re: Line function and rotate.
Thanks, I will have to look up and refresh my math on this subject before attempting it.albinopapa wrote: As for rotation, you would use the sin and cos functions by passing in an angle in radians and multiplying the result by the distance to the end points in either direction. Normally, rotations are counter clockwise in math, but because the screen coordinates in the Y axis go from top to bottom, rotations are clockwise.
First tho, I need to add the "slope intercept " formula. Really gonna try myself with what you described to me, don't wanna peak just yet on the videos
y drop = x/y (0,0 - 10,70 = 0,1428)
x draw = y/x (0,0 - 70,10 = 7)
Something like that? Gah I need to take math lessons
-
- Posts: 4373
- Joined: February 28th, 2013, 3:23 am
- Location: Oklahoma, United States
Re: Line function and rotate.
Spoiler:
To rotate a line, you must first start with an angle, it's initial orientation. You must decide if the line going from midpoint to end point is it's orientation or if the normal coming from the midpoint, which is perpendicular to the line, is the orientation.
Code: Select all
Normal
|
|
|
|
|
---------------------------------------------------- // line
Code: Select all
Vec2 Vec2::Rotation(const float angle) const
{
Vec2 result;
float cosine = cosf(angle);
float sine = sinf(angle);
result.x = x * cosine - y * sine;
result.y = x * sine + y * cosine;
return result;
}
If you think paging some data from disk into RAM is slow, try paging it into a simian cerebrum over a pair of optical nerves. - gameprogrammingpatterns.com
Re: Line function and rotate.
If you're interested, Old Beg T10 is where I go over line drawing, and Old Series Advanced 2 is where I go over rotating points.
Chili