How to draw a simple grid using opengl?

Question

I am trying to draw a grid that should look something like this:

but what I get instead:

A black screen with two orange lines on the left and bottom borders

This is my code:

#include <iostream>
#include <GL/glut.h>

#define WIDTH 1000
#define HEIGHT 400
#define OFFSET 200

using namespace std;

float x = 0;
float y = 0;

void init (void)
{
    //glClearColor (1.0, 1.0, 1.0, 0.0);
    glClear (GL_COLOR_BUFFER_BIT);
    glMatrixMode (GL_PROJECTION);
    glLoadIdentity();
    glOrtho (0.0, 5.0, 0.0, 5.0, -2.0, 2.0);

    glMatrixMode (GL_MODELVIEW);
    glLoadIdentity();
}

void drawline (float x1, float y1, float x2, float y2)
{
    glBegin (GL_LINES);
    glVertex2f (x1, y1);
    glVertex2f (x2, y2);
    glEnd();
}

void drawgrid()
{
    glClearColor (1.0, 1.0, 1.0, 1.0);
    glColor3ub (240, 57, 53);

    for (float i = 0; i < HEIGHT; i += 10)
    {
        if ((int) i % 100 == 0) glLineWidth (3.0);
        else if ((int) i % 50 == 0) glLineWidth (2.0);
        else glLineWidth (1.0);
        drawline (0, i, (float) WIDTH, i);
    }

    for (float i = 0; i < WIDTH; i += 10)
    {
        if ((int) i % 100 == 0) glLineWidth (3.0);
        else if ((int) i % 50 == 0) glLineWidth (2.0);
        else glLineWidth (1.0);
        drawline (i, 0, i, (float) HEIGHT);
    }
}

void display()
{
    drawgrid();

    glFlush();
    glutSwapBuffers();
}

int main (int argc, char **argv)
{
    glutInit (&argc, argv);
    glutInitDisplayMode (GLUT_SINGLE | GLUT_RGBA);
    glutInitWindowSize (WIDTH, HEIGHT);
    glutCreateWindow ("ECG");

    init();

    glutDisplayFunc (display);
    glDisable (GL_TEXTURE_2D);

    glutMainLoop();

    return 0;
}

What am I doing wrong? How to make the background white and draw the grid properly?

Answer 1

Another way of drawing

 void drawSquare()
{
    glClear(GL_COLOR_BUFFER_BIT);
    glPolygonMode(GL_FRONT_AND_BACK, GL_LINE);
    glColor3f(1.0, 0.0, 0.0);
    int xsize=0,ysize=0;
    for(int j=0;j<10;j++)
    {

        xsize=0;
        for(int i=0;i<10;i++)
        {
             glBegin(GL_POLYGON);
               glVertex3f(-50.0+xsize, -50.0+ysize, 0.0);
               glVertex3f(-40.0+xsize, -50.0+ysize, 0.0);
               glVertex3f(-40.0+xsize, -40.0+ysize, 0.0);
               glVertex3f(-50.0+xsize, -40.0+ysize, 0.0);
            glEnd();
         xsize+=10.0;
     }
     ysize+=10.0;
     }
     glFlush();
  }

with glOrtho(-50.0, 50.0, -50.0, 50.0, -1.0, 1.0);

Answer 2

You set up your projection to map the coordinate range [0,5] to the screen. And then, you draw lines at the distance of 10 units, so only the line y=0 is shown.

Actually, the image is implementation specific. You could see the bottom horizontal line, or you could not see it, because you draw not at the bottom pixel center, bot at the bottom border of the bottom pixel row. An implementation might round that away. That is what happened to your left vertical line at x=0.

So you should just set up your glOrtho call to match the coordinate range you want to use, and you will see the lines you are drawing.

Use glClearColor to change the background color.

Also don't use glutInitDisplayMode(GLUT_SINGLE | ...) in combination with glutSwapBuffers(). Either use single buffering, and then there is no buffers to swap, or, as I'd recommend, use double buffering and swap buffers after a frame is finished. Also remove the glFlush there, it is not needed if glutSwapBuffers is used.