Drawing a diagonal semicircle in OpenGL - c

I'm trying to draw a diagonal semicircle. So far I've only been able to draw ones that begin and end on a horizontal or vertical axis, like this:
I've tried modifying the code to tilt the circle, but it doesn't work. Can someone please tell me where I've gone wrong, this is infuriating!
float theta, tanTheta, x, y, dx, dy;
int circle_points = 1000, radius = 70;
glBegin(GL_POLYGON);
for(int i = 0; i < circle_points; i++)
{
dx = pts[1].x - pts[0].x;
dy = pts[1].y - pts[0].y;
tanTheta = tan(dy / dx);
// get the inverse
theta = atan(tanTheta);
x = radius * cos(theta);
y = radius * sin(theta);
glVertex2f(x, y);
}
glEnd();

I recommend to calculate the angle to the start point and the angle to the end point by atan2.
Interpolate the angle between the start angle and the end angle and draw a line along the corresponding points on the circe:
float ang_start, ang_end, theta, x, y;
ang_start = atan2( pts[0].y, pts[0].x );
ang_end = atan2( pts[1].y, pts[1].x );
if ( ang_start > ang_end )
ang_start -= 2.0f * M_PI;
glBegin(GL_LINE_STRIP);
for(int i = 0; i <= circle_points; i++)
{
float w = (float)i / (float)circle_points;
float theta = ang_start + w * ( ang_end - ang_start );
x = radius * cos(theta);
y = radius * sin(theta);
glVertex2f(x, y);
}
glEnd();

Related

How to find points on circle when center, radius, and angle is given in C?

I have a triangle that i am trying to rotate(on 2D plain). I calculated it's centroid so, now i have an imaginary circle with center(centroid),points at 0 degree angle (1st vertex of the trangle). My idea is to rotate each vertex by increasing it's angle(on a loop) and finding new coordinates for the vertex at that angle.
#include <stdio.h>
#include <math.h>
//"the function"
int calculate_new_vertex_for_trangle(int center_x, int center_y,int x_at_0,int y_at_0,int angle)
{
double radius = sqrt(pow(x_at_0-center_x,2)+pow(y_at_0-center_y,2));
float angle_to_radian = ((22.0/7.0)/180)*angle;
// googled formula
float new_x = center_x + radius*cos(angle_to_radian);
float new_y = center_y + radius*sin(angle_to_radian);
printf("x : %f, y : %f \nradius : %f\n", new_x, new_y,radius);
return 0;
}
Expected Output
But the result I got was :Image
Numbers at the end of the lines are coordinate's position at respective angle i got using "the function".
This formula:
float new_x = center_x + radius*cos(angle_to_radian);
float new_y = center_y + radius*sin(angle_to_radian);
gives the new position of the vertex at angle=0 after a counter-clockwise rotation around (center_x, center_y).
But you want the new position for any vertex.
You can calculate the initial angle (counter-clockwise) for a point at (px,py):
float angle_ini = atan2(px-center_x, py-center_y);
And then use it for the rotated position:
float new_x = center_x + radius*cos(angle_to_radian + angle_ini);
float new_y = center_y + radius*sin(angle_to_radian + angle_ini);
There's a second formula wich achieves the same result, called "rotation transform"
float angle_to_radian = (3.14159265358979/180)*angle;
float sinA = sin(angle_to_radian);
float cosA = cos(angle_to_radian);
float new_x = center_x + (px-center_x)*cosA - (py-center_y)*sinA;
float new_y = center_y + (px-center_x)*sinA + (py-center_y)*cosA;
Notice that with this second way you avoid calculating the radius.
I think, a good way to rotate a point around another one, is to use the rotation matrix. You can find more details about this on Wikipedia:
https://en.wikipedia.org/wiki/Rotation_matrix
I hope this sample code will help you:
#include <stdio.h>
#include <math.h>
int main()
{
// Center on circle
float center_x = 0.0;
float center_y = 0.0;
// Point on circle
float point_x = 1.0;
float point_y = 1.0;
// Rotation angle
float rotation_deg = 180;
float rotation_rad = rotation_deg * M_PI / 180.0;
// Rotation matrix
float a = cos(rotation_rad);
float b = -sin(rotation_rad);
float c = sin(rotation_rad);
float d = cos(rotation_rad);
// Matrix multiplication
float dx = point_x - center_x;
float dy = point_y - center_y;
float new_x = a * dx + b * dy;
float new_y = c * dx + d * dy;
// Add center point
new_x += center_x;
new_y += center_y;
printf("old_point = %.2f|%.2f\n", point_x, point_y);
printf("new_point = %.2f|%.2f\n", new_x, new_y);
}
Regards.

Curved cylinder in a 3D space OpenGL (C) [duplicate]

The following code shows a straight cylinder/pipe in OpenGL C language.
#include <stdio.h>
#include <stdlib.h>
#include <GL/glut.h>
#include <math.h>
#define PI 3.1415927
void draw_cylinder(GLfloat radius, GLfloat height, GLubyte R, GLubyte G, GLubyte B)
{
GLfloat x = 0.0;
GLfloat y = 0.0;
GLfloat angle = 0.0;
GLfloat angle_stepsize = 0.1;
// Draw the tube
glColor3ub(R-40,G-40,B-40);
glBegin(GL_QUAD_STRIP);
angle = 0.0;
while( angle < 2*PI ) {
x = radius * cos(angle);
y = radius * sin(angle);
glVertex3f(x, y , height);
glVertex3f(x, y , 0.0);
angle = angle + angle_stepsize;
}
glVertex3f(radius, 0.0, height);
glVertex3f(radius, 0.0, 0.0);
glEnd();
// Draw the circle on top of cylinder
glColor3ub(R,G,B);
glBegin(GL_POLYGON);
angle = 0.0;
while( angle < 2*PI ) {
x = radius * cos(angle);
y = radius * sin(angle);
glVertex3f(x, y , height);
angle = angle + angle_stepsize;
}
glVertex3f(radius, 0.0, height);
glEnd();
}
void display(void)
{
glClear(GL_COLOR_BUFFER_BIT);
glLoadIdentity();
glTranslatef(-0.5,0.0,-2.5);
glRotatef(100.0, 0.725, 1.0, 1.0);
draw_cylinder(0.15, 1.0, 255, 160, 100);
glFlush();
}
void reshape(int width, int height)
{
if (width == 0 || height == 0) return;
glMatrixMode(GL_PROJECTION);
glLoadIdentity();
gluPerspective(35.0, (GLdouble)width/(GLdouble)height,0.5, 20.0);
glMatrixMode(GL_MODELVIEW);
glViewport(0, 0, width, height);
}
int main(int argc, char **argv)
{
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB);
glutInitWindowSize(640,580);
glutCreateWindow("Create Cylinder");
glClearColor(0.0,0.0,0.0,0.0);
glutDisplayFunc(display);
glutReshapeFunc(reshape);
glutMainLoop();
return 0;
}
At the moment it draws a straight cylinder/pipe. And I wanted to curve it to look like this.
First I recommend to split the cylinder into slices. The following cone will draw exactly the same cylinder, but it splits the cylinder int slices. The slices have different colors to visualize the effect.
GLfloat h0, h1, angle, x, y;
int i, j;
int slices = 8;
for ( i = 0; i < slices; i++ )
{
h0 = (float)i / (float)slices;
h1 = (float)(i+1) / (float)slices;
glColor3f( 1.0f-h0, 0.0, h1 );
glBegin(GL_QUAD_STRIP);
for ( j = 0; j <= 360; ++ j )
{
angle = PI * (float)j * PI / 180.0f;
x = radius * cos(angle);
y = radius * sin(angle);
glVertex3f( x, y, h0 );
glVertex3f( x, y, h1 );
}
glEnd();
}
Then you have to define a bend radius and a bend start and end angle. The following code draw a bended pipe form bend_ang0 to bend_ang1, with a radius bend_radius. The bend angles can be calculated in relation to the bend radius and the length of the pipe:
GLfloat w0, w1, ang0, ang1, angle, x, y, xb, yb, zb;
int i, j;
int slices = 8;
GLfloat bend_radius = 1.0f;
GLfloat bend_angle, bend_ang0, bend_ang1;
bend_angle = bend_radius * height;
bend_ang0 = -bend_angle/2.0f;
bend_ang1 = bend_angle/2.0f;
for ( i = 0; i < slices; i++ )
{
w0 = (float)i / (float)slices;
w1 = (float)(i+1) / (float)slices;
ang0 = bend_ang0 + (bend_ang1-bend_ang0) * w0;
ang1 = bend_ang0 + (bend_ang1-bend_ang0) * w1;
glColor3f( 1.0f-w0, 0.0, w1 );
glBegin(GL_QUAD_STRIP);
for ( j = 0; j <= 360; ++ j )
{
angle = PI * (float)j * PI / 180.0f;
x = radius * cos(angle) + bend_radius;
y = radius * sin(angle);
xb = sin( ang0 ) * x;
yb = y;
zb = cos( ang0 ) * x;
glVertex3f( xb, yb, zb );
xb = sin( ang1 ) * x;
yb = y;
zb = cos( ang1 ) * x;
glVertex3f( xb, yb, zb );
}
glEnd();
}
For the following image I activated the depth test and changed the model view matrix:
void display(void)
{
glEnable( GL_DEPTH_TEST );
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glLoadIdentity();
glTranslatef(0.0f, -0.5f, -4.0f);
glRotatef(-90.0f, 1.0f, 0.0, 0.0f);
draw_cylinder(0.15, 2.0, 255, 160, 100);
glFlush();
}
Currently you are drawing the entire height of the cylinder in one go ... to create a curved surface you must instead take your existing code and have it create a succession of tiny cylinders each with a tiny height then stack them up to consume the original height.
One approach would be to introduce a new function which becomes the parent of your
void draw_cylinder(GLfloat radius, GLfloat height, GLubyte R, GLubyte G, GLubyte B)
perhaps call it
draw_curved_cylinder
inside this new function you have a loop where you make calls to draw_cylinder giving it the parameters of each of these tiny cylinders ... currently your draw function blindly stretches the height from 0 to your given height ... replace that with settings for the given tiny cylinder ... also to make the final cylinder curved each tiny cylinder must have its X and Y coordinates follow the curved trajectory so in that new function draw_curved_cylinder increment those so they vary as your synthesize each new tiny cylinder
PS - be aware that you are not using modern OpenGL - glBegin is obsolete and should be avoided

OpenGL Glut C - want to render curved cylinder

The following code shows a straight cylinder/pipe in OpenGL C language.
#include <stdio.h>
#include <stdlib.h>
#include <GL/glut.h>
#include <math.h>
#define PI 3.1415927
void draw_cylinder(GLfloat radius, GLfloat height, GLubyte R, GLubyte G, GLubyte B)
{
GLfloat x = 0.0;
GLfloat y = 0.0;
GLfloat angle = 0.0;
GLfloat angle_stepsize = 0.1;
// Draw the tube
glColor3ub(R-40,G-40,B-40);
glBegin(GL_QUAD_STRIP);
angle = 0.0;
while( angle < 2*PI ) {
x = radius * cos(angle);
y = radius * sin(angle);
glVertex3f(x, y , height);
glVertex3f(x, y , 0.0);
angle = angle + angle_stepsize;
}
glVertex3f(radius, 0.0, height);
glVertex3f(radius, 0.0, 0.0);
glEnd();
// Draw the circle on top of cylinder
glColor3ub(R,G,B);
glBegin(GL_POLYGON);
angle = 0.0;
while( angle < 2*PI ) {
x = radius * cos(angle);
y = radius * sin(angle);
glVertex3f(x, y , height);
angle = angle + angle_stepsize;
}
glVertex3f(radius, 0.0, height);
glEnd();
}
void display(void)
{
glClear(GL_COLOR_BUFFER_BIT);
glLoadIdentity();
glTranslatef(-0.5,0.0,-2.5);
glRotatef(100.0, 0.725, 1.0, 1.0);
draw_cylinder(0.15, 1.0, 255, 160, 100);
glFlush();
}
void reshape(int width, int height)
{
if (width == 0 || height == 0) return;
glMatrixMode(GL_PROJECTION);
glLoadIdentity();
gluPerspective(35.0, (GLdouble)width/(GLdouble)height,0.5, 20.0);
glMatrixMode(GL_MODELVIEW);
glViewport(0, 0, width, height);
}
int main(int argc, char **argv)
{
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB);
glutInitWindowSize(640,580);
glutCreateWindow("Create Cylinder");
glClearColor(0.0,0.0,0.0,0.0);
glutDisplayFunc(display);
glutReshapeFunc(reshape);
glutMainLoop();
return 0;
}
At the moment it draws a straight cylinder/pipe. And I wanted to curve it to look like this.
First I recommend to split the cylinder into slices. The following cone will draw exactly the same cylinder, but it splits the cylinder int slices. The slices have different colors to visualize the effect.
GLfloat h0, h1, angle, x, y;
int i, j;
int slices = 8;
for ( i = 0; i < slices; i++ )
{
h0 = (float)i / (float)slices;
h1 = (float)(i+1) / (float)slices;
glColor3f( 1.0f-h0, 0.0, h1 );
glBegin(GL_QUAD_STRIP);
for ( j = 0; j <= 360; ++ j )
{
angle = PI * (float)j * PI / 180.0f;
x = radius * cos(angle);
y = radius * sin(angle);
glVertex3f( x, y, h0 );
glVertex3f( x, y, h1 );
}
glEnd();
}
Then you have to define a bend radius and a bend start and end angle. The following code draw a bended pipe form bend_ang0 to bend_ang1, with a radius bend_radius. The bend angles can be calculated in relation to the bend radius and the length of the pipe:
GLfloat w0, w1, ang0, ang1, angle, x, y, xb, yb, zb;
int i, j;
int slices = 8;
GLfloat bend_radius = 1.0f;
GLfloat bend_angle, bend_ang0, bend_ang1;
bend_angle = bend_radius * height;
bend_ang0 = -bend_angle/2.0f;
bend_ang1 = bend_angle/2.0f;
for ( i = 0; i < slices; i++ )
{
w0 = (float)i / (float)slices;
w1 = (float)(i+1) / (float)slices;
ang0 = bend_ang0 + (bend_ang1-bend_ang0) * w0;
ang1 = bend_ang0 + (bend_ang1-bend_ang0) * w1;
glColor3f( 1.0f-w0, 0.0, w1 );
glBegin(GL_QUAD_STRIP);
for ( j = 0; j <= 360; ++ j )
{
angle = PI * (float)j * PI / 180.0f;
x = radius * cos(angle) + bend_radius;
y = radius * sin(angle);
xb = sin( ang0 ) * x;
yb = y;
zb = cos( ang0 ) * x;
glVertex3f( xb, yb, zb );
xb = sin( ang1 ) * x;
yb = y;
zb = cos( ang1 ) * x;
glVertex3f( xb, yb, zb );
}
glEnd();
}
For the following image I activated the depth test and changed the model view matrix:
void display(void)
{
glEnable( GL_DEPTH_TEST );
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glLoadIdentity();
glTranslatef(0.0f, -0.5f, -4.0f);
glRotatef(-90.0f, 1.0f, 0.0, 0.0f);
draw_cylinder(0.15, 2.0, 255, 160, 100);
glFlush();
}
Currently you are drawing the entire height of the cylinder in one go ... to create a curved surface you must instead take your existing code and have it create a succession of tiny cylinders each with a tiny height then stack them up to consume the original height.
One approach would be to introduce a new function which becomes the parent of your
void draw_cylinder(GLfloat radius, GLfloat height, GLubyte R, GLubyte G, GLubyte B)
perhaps call it
draw_curved_cylinder
inside this new function you have a loop where you make calls to draw_cylinder giving it the parameters of each of these tiny cylinders ... currently your draw function blindly stretches the height from 0 to your given height ... replace that with settings for the given tiny cylinder ... also to make the final cylinder curved each tiny cylinder must have its X and Y coordinates follow the curved trajectory so in that new function draw_curved_cylinder increment those so they vary as your synthesize each new tiny cylinder
PS - be aware that you are not using modern OpenGL - glBegin is obsolete and should be avoided

How to draw circles, arcs and vector graphics in SDL?

I'm using SDL2.
The only way I can find to draw a shape is with the line, rect and pixel functions, as explained here.
Apart from using trig or the "equation of a circle", how could I draw a curve? How about general vector graphics?
Is SDL an appropriate starting point or should I look elsewhere?
This is an example of the Midpoint Circle Algorithm as referenced above. It doesn't require a math library and is very fast. (Renders in about 500 microseconds) This is what Windows uses/used to rasterize circles.
void DrawCircle(SDL_Renderer * renderer, int32_t centreX, int32_t centreY, int32_t radius)
{
const int32_t diameter = (radius * 2);
int32_t x = (radius - 1);
int32_t y = 0;
int32_t tx = 1;
int32_t ty = 1;
int32_t error = (tx - diameter);
while (x >= y)
{
// Each of the following renders an octant of the circle
SDL_RenderDrawPoint(renderer, centreX + x, centreY - y);
SDL_RenderDrawPoint(renderer, centreX + x, centreY + y);
SDL_RenderDrawPoint(renderer, centreX - x, centreY - y);
SDL_RenderDrawPoint(renderer, centreX - x, centreY + y);
SDL_RenderDrawPoint(renderer, centreX + y, centreY - x);
SDL_RenderDrawPoint(renderer, centreX + y, centreY + x);
SDL_RenderDrawPoint(renderer, centreX - y, centreY - x);
SDL_RenderDrawPoint(renderer, centreX - y, centreY + x);
if (error <= 0)
{
++y;
error += ty;
ty += 2;
}
if (error > 0)
{
--x;
tx += 2;
error += (tx - diameter);
}
}
}
If you want to write your own circle drawing function, then I'd suggest adapting the midpoint algorithm to SDL2 by drawing pixels.
Curves would be done similarly, but would use more of an ellipses drawing algorithm.
Actual vector graphics start to get much more complicated, and you'd probably have to find something that renders SVG files, which I'm not sure there are many options for SDL2.
However, if you would rather simply have functions that you can work with I'd suggest going straight to SDL2_gfx instead. It has many more functions already implemented for you to work with.
SDL allows for third party libs to draw on a texture. If cairo was desirable, it could be used in a function like this:
cairo_t*cb(cairo_t*cr)
{cairo_set_source_rgb(cr, 1.0, 1.0, 1.0);
cairo_rectangle(cr, 10, 20, 128, 128);
cairo_stroke(cr);
return cr;
}
then cb can be passed to this function:
cairo_t*cai(SDL_Window*w,SDL_Renderer*r,cairo_t*(*f)(cairo_t*))
{int width, height, pitch;void *pixels;
SDL_GetWindowSize(w, &width, &height);
SDL_Texture*t=SDL_CreateTexture(r,SDL_PIXELFORMAT_ARGB8888,SDL_TEXTUREACCESS_STREAMING,width,height);
SDL_LockTexture(t, NULL, &pixels, &pitch);
cairo_surface_t *cs=cairo_image_surface_create_for_data(pixels,CAIRO_FORMAT_ARGB32,width,height,pitch);
cairo_t*s=cairo_create(cs);
cairo_t*fr=f(s);SDL_UnlockTexture(t);SDL_RenderCopy(r,t,NULL,NULL);SDL_RenderPresent(r);
return fr;
}
If you want to do a circle or ellipse without 3rd party libraries, include math.h and use the function below I wrote. It will draw aliased ellipse or circles very well. Tested on SDL 2.0.2 and works. It draws one quadrant arc, and mirrors the other arcs, reducing calls to cosf and sinf.
//draw one quadrant arc, and mirror the other 4 quadrants
void sdl_ellipse(SDL_Renderer* r, int x0, int y0, int radiusX, int radiusY)
{
float pi = 3.14159265358979323846264338327950288419716939937510;
float pih = pi / 2.0; //half of pi
//drew 28 lines with 4x4 circle with precision of 150 0ms
//drew 132 lines with 25x14 circle with precision of 150 0ms
//drew 152 lines with 100x50 circle with precision of 150 3ms
const int prec = 27; // precision value; value of 1 will draw a diamond, 27 makes pretty smooth circles.
float theta = 0; // angle that will be increased each loop
//starting point
int x = (float)radiusX * cos(theta);//start point
int y = (float)radiusY * sin(theta);//start point
int x1 = x;
int y1 = y;
//repeat until theta >= 90;
float step = pih/(float)prec; // amount to add to theta each time (degrees)
for(theta=step; theta <= pih; theta+=step)//step through only a 90 arc (1 quadrant)
{
//get new point location
x1 = (float)radiusX * cosf(theta) + 0.5; //new point (+.5 is a quick rounding method)
y1 = (float)radiusY * sinf(theta) + 0.5; //new point (+.5 is a quick rounding method)
//draw line from previous point to new point, ONLY if point incremented
if( (x != x1) || (y != y1) )//only draw if coordinate changed
{
SDL_RenderDrawLine(r, x0 + x, y0 - y, x0 + x1, y0 - y1 );//quadrant TR
SDL_RenderDrawLine(r, x0 - x, y0 - y, x0 - x1, y0 - y1 );//quadrant TL
SDL_RenderDrawLine(r, x0 - x, y0 + y, x0 - x1, y0 + y1 );//quadrant BL
SDL_RenderDrawLine(r, x0 + x, y0 + y, x0 + x1, y0 + y1 );//quadrant BR
}
//save previous points
x = x1;//save new previous point
y = y1;//save new previous point
}
//arc did not finish because of rounding, so finish the arc
if(x!=0)
{
x=0;
SDL_RenderDrawLine(r, x0 + x, y0 - y, x0 + x1, y0 - y1 );//quadrant TR
SDL_RenderDrawLine(r, x0 - x, y0 - y, x0 - x1, y0 - y1 );//quadrant TL
SDL_RenderDrawLine(r, x0 - x, y0 + y, x0 - x1, y0 + y1 );//quadrant BL
SDL_RenderDrawLine(r, x0 + x, y0 + y, x0 + x1, y0 + y1 );//quadrant BR
}
}
My answer extends Scotty Stephens answer by making it a bunch more performant by reducing the API calls to a single one.
// rounding helper, simplified version of the function I use
int roundUpToMultipleOfEight( int v )
{
return (v + (8 - 1)) & -8;
}
void DrawCircle( SDL_Renderer * renderer, SDL_Point center, int radius )
{
// 35 / 49 is a slightly biased approximation of 1/sqrt(2)
const int arrSize = roundUpToMultipleOfEight( radius * 8 * 35 / 49 );
SDL_Point points[arrSize];
int drawCount = 0;
const int32_t diameter = (radius * 2);
int32_t x = (radius - 1);
int32_t y = 0;
int32_t tx = 1;
int32_t ty = 1;
int32_t error = (tx - diameter);
while( x >= y )
{
// Each of the following renders an octant of the circle
points[drawCount+0] = { center.x + x, center.y - y };
points[drawCount+1] = { center.x + x, center.y + y };
points[drawCount+2] = { center.x - x, center.y - y };
points[drawCount+3] = { center.x - x, center.y + y };
points[drawCount+4] = { center.x + y, center.y - x };
points[drawCount+5] = { center.x + y, center.y + x };
points[drawCount+6] = { center.x - y, center.y - x };
points[drawCount+7] = { center.x - y, center.y + x };
drawCount += 8;
if( error <= 0 )
{
++y;
error += ty;
ty += 2;
}
if( error > 0 )
{
--x;
tx += 2;
error += (tx - diameter);
}
}
SDL_RenderDrawPoints( renderer, points, drawCount );
}
A circle of radius 141 would have had 800 SDL_RenderDrawPoint calls in Scottys version, this new version does only execute one single SDL_RenderDrawPoints call, making it much more performant.
One could also strip the rendering portion out of this function, to allow the result to be cached and reused like shown below.
std::vector<SDL_Point> PixelizeCircle( SDL_Point center, int radius )
{
std::vector<SDL_Point> points;
// 35 / 49 is a slightly biased approximation of 1/sqrt(2)
const int arrSize = roundUpToMultipleOfEight( radius * 8 * 35 / 49 );
points.reserve( arrSize );
const int32_t diameter = (radius * 2);
int32_t x = (radius - 1);
int32_t y = 0;
int32_t tx = 1;
int32_t ty = 1;
int32_t error = (tx - diameter);
while( x >= y )
{
// Each of the following renders an octant of the circle
points.push_back( { center.x + x, center.y - y } );
points.push_back( { center.x + x, center.y + y } );
points.push_back( { center.x - x, center.y - y } );
points.push_back( { center.x - x, center.y + y } );
points.push_back( { center.x + y, center.y - x } );
points.push_back( { center.x + y, center.y + x } );
points.push_back( { center.x - y, center.y - x } );
points.push_back( { center.x - y, center.y + x } );
if( error <= 0 )
{
++y;
error += ty;
ty += 2;
}
if( error > 0 )
{
--x;
tx += 2;
error += (tx - diameter);
}
}
return points; // RVO FTW
}
int main()
{
std::vector<SDL_Point> circle = PixelizeCircle( SDL_Point{ 84, 72 }, 79 );
//...
while( true )
{
//...
SDL_RenderDrawPoints( renderer, circle.data(), circle.size() );
//...
}
}

Filling a polygon

I created this function that draws a simple polygon with n number of vertexes:
void polygon (int n)
{
double pI = 3.141592653589;
double area = min(width / 2, height / 2);
int X = 0, Y = area - 1;
double offset = Y;
int lastx, lasty;
double radius = sqrt(X * X + Y * Y);
double quadrant = atan2(Y, X);
int i;
for (i = 1; i <= n; i++)
{
lastx = X; lasty = Y;
quadrant = quadrant + pI * 2.0 / n;
X = round((double)radius * cos(quadrant));
Y = round((double)radius * sin(quadrant));
setpen((i * 255) / n, 0, 0, 0.0, 1); // r(interval) g b, a, size
moveto(offset + lastx, offset + lasty); // Moves line offset
lineto(offset + X, offset + Y); // Draws a line from offset
}
}
How can I fill it with a solid color?
I have no idea how can I modify my code in order to draw it filled.
The common approach to fill shapes is to find where the edges of the polygon cross either each x or each y coordinate. Usually, y coordinates are used, so that the filling can be done using horizontal lines. (On framebuffer devices like VGA, horizontal lines are faster than vertical lines, because they use consecutive memory/framebuffer addresses.)
In that vein,
void fill_regular_polygon(int center_x, int center_y, int vertices, int radius)
{
const double a = 2.0 * 3.14159265358979323846 / (double)vertices;
int i = 1;
int y, px, py, nx, ny;
if (vertices < 3 || radius < 1)
return;
px = 0;
py = -radius;
nx = (int)(0.5 + radius * sin(a));
ny = (int)(0.5 - radius * cos(a));
y = -radius;
while (y <= ny || ny > py) {
const int x = px + (nx - px) * (y - py) / (ny - py);
if (center_y + y >= 0 && center_y + y < height) {
if (center_x - x >= 0)
moveto(center_x - x, center_y + y);
else
moveto(0, center_y + y);
if (center_x + x < width)
lineto(center_x + x, center_y + y);
else
lineto(width - 1, center_y + y);
}
y++;
while (y > ny) {
if (nx < 0)
return;
i++;
px = nx;
py = ny;
nx = (int)(0.5 + radius * sin(a * (double)i));
ny = (int)(0.5 - radius * cos(a * (double)i));
}
}
}
Note that I only tested the above with a simple SVG generator, and compared the drawn lines to the polygon. Seems to work correctly, but use at your own risk; no guarantees.
For general shapes, use your favourite search engine to look for "polygon filling" algorithms. For example, this, this, this, and this.
There are 2 different ways to implement a solution:
Scan-line
Starting at the coordinate that is at the top (smallest y value), continue to scan down line by line (incrementing y) and see which edges intersect the line.
For convex polygons you find 2 points, (x1,y) and (x2,y). Simply draw a line between those on each scan-line.
For concave polygons this can also be a multiple of 2. Simply draw lines between each pair. After one pair, go to the next 2 coordinates. This will create a filled/unfilled/filled/unfilled pattern on that scan line which resolves to the correct overall solution.
In case you have self-intersecting polygons, you would also find coordinates that are equal to some of the polygon points, and you have to filter them out. After that, you should be in one of the cases above.
If you filtered out the polygon points during scan-lining, don't forget to draw them as well.
Flood-fill
The other option is to use flood-filling. It has to perform more work evaluating the border cases at every step per pixel, so this tends to turn out as a slower version. The idea is to pick a seed point within the polygon, and basically recursively extend up/down/left/right pixel by pixel until you hit a border.
The algorithm has to read and write the entire surface of the polygon, and does not cross self-intersection points. There can be considerable stack-buildup (for naive implementations at least) for large surfaces, and the reduced flexibility you have for the border condition is pixel-based (e.g. flooding into gaps when other things are drawn on top of the polygon). In this sense, this is not a mathematically correct solution, but it works well for many applications.
The most efficient solution is by decomposing the regular polygon in trapezoids (and one or two triangles).
By symmetry, the vertexes are vertically aligned and it is an easy matter to find the limiting abscissas (X + R cos(2πn/N) and X + R cos(2π(+1)N)).
You also have the ordinates (Y + R sin(2πn/N) and Y + R sin(2π(+1)N)) and it suffices to interpolate linearly between two vertexes by Y = Y0 + (Y1 - Y0) (X - X0) / (X1 - X0).
Filling in horizontal runs is a little more complex, as the vertices may not be aligned horizontally and there are more trapezoids.
Anyway, it seems that I / solved / this myself again, when not relying on assistance (or any attempt for it)
void polygon (int n)
{
double pI = 3.141592653589;
double area = min(width / 2, height / 2);
int X = 0, Y = area - 1;
double offset = Y;
int lastx, lasty;
while(Y-->0) {
double radius = sqrt(X * X + Y * Y);
double quadrant = atan2(Y, X);
int i;
for (i = 1; i <= n; i++)
{
lastx = X; lasty = Y;
quadrant = quadrant + pI * 2.0 / n;
X = round((double)radius * cos(quadrant));
Y = round((double)radius * sin(quadrant));
//setpen((i * 255) / n, 0, 0, 0.0, 1);
setpen(255, 0, 0, 0.0, 1); // just red
moveto(offset + lastx, offset + lasty);
lineto(offset + X, offset + Y);
} }
}
As you can see, it isn't very complex, which means it might not be the most efficient solution either.. but it is close enough.
It decrements radius and fills it by virtue of its smaller version with smaller radius.
On that way, precision plays an important role and the higher n is the less accuracy it will be filled with.

Resources