Drawing graphs of functions in a console application

[Dren]

Whats on TV today?

Hmmm... I missed this place... I decided to come back with a little tutorial. Its about drawing graphs in a console application using C++. Drawing graphs of non-linear functions is not that easy. You have to calculate stuff like domain, range, asymptotes, local and global extremas etc…But, are we going to code the program that will do all that stuff? Fortunately NOT! Since the computer has the “power” to calculate tons of stuff in an extremely short period of time we will do something like this: Imagine you have the coordinate system. It is possible to draw EVERY FUNCTION by drawing dots on it like this P(x,f(x)). This means we are starting form 0 for example and finding f(0) (in this case the function is sin(x)) so for f(0) we will get the sine value of the angle 0. After showing the dot (x, sin(x)) we increase the x by 1 and find the sine of it again to show the next dot. After showing 360 dots a sine wave will be drawn in the range 0, 2Pi. This is how we will do it, easy isn’t it?

Drawing in a console application?

As I heard, it is not possible to draw something in the console application on C++. So my idea was a little weird. I thought of creating a multidimensional array witch will be used as a graph. For example the array CS[x][y]. I turned every element of the array into 0 and then, by calculating the function specific element into 1. Then after everything is done print the array. Sounds cool right?

Ok, how to do it?

At least the code… Ill be describing every part of the code needed to do this thing.

First, I have declared a function called Funksioni (its in Albanian but it doesn’t matter) in witch we will type the function we want to draw.

float Funksioni(float x);

float Funksioni(float x)
{
    float y;
    
        y=sin(x);
    
    return y;
}

This function will be called by a loop witch will add the “dots” to the array. On the main function I declared the array called SK witch will be the “coordinate system” and a couple of other variables including the Pi.

  int SK[80][24];
  int j;
  float k,Pi;
  

  Pi=3.14159265358;

After this, I added a double loop witch will turn every element of the array to 0.

  for(int a=0;a<=24;a++)
  {
      for(int b=0;b<=80;b++)
      {
            SK[b][a]=0;
      }
  }

Now comes the weird part. I will show the code first and then talk about it.

  for(float i=-480;i<480;i++)
  {
      int z=int((i+480)/12);

      k = 12 + 4 *  -Funksioni((i * Pi)/180);
      j=int(k);
      
      if (j <= 24 & j >0)
            SK[z][j]=1;
  }

I think that the console’s width is 81 characters but I took it as 80 because I needed it to be even. Imagine what would happen if I would draw the sine wave with 80 dots. It wouldn’t look like a sine wave at all, so I multiplied 80 by 12 and got 960. I wanted to show the graphs negative quadrants too so I divided 960 by 2 and got 480. This means the graph will be shown in the range -480, 480.

In the line:

      int z=int((i+480)/12);

I took the integer part of the i turned back into divided by 12 to turn the maximal value back to 80 (the highest element of the array) witch will later be used as the x coordinate.

Here:

      k = 12 + 4 *  -Funksioni((i * Pi)/180);

k will be the value of the function for the point i. 12 has been added to it because that will tell the function to get 12 characters down (in the middle of the coordinate system since its height is 24) . 4 will be something like a regulator of the coefficient of direction and a factor that will make the trig. functions visible. In the function i is multiplied by Pi and then divided by 180 because trig. functions in C++ use radians as angle measurement units. That doesn’t really matter for other functions.

In this line:

      j=int(k);

The Variable j will take only the integer part of k (since we cannot say SK[3.39576][5] = 3)

And here:

      if (j <= 24 & j >0)
            SK[z][j]=1;

I wanted to say don’t go outside the borders...


Now the array is filled with the values and we need to print them…

This is the code:

  for(int y=1;y<=24;y++)
  {
      if (y == 12)
      for(int d=0;d<=79;d++)
            if (SK[d][12] == 0)
                if (d==39)
                     cout << char(197);
                else
                     cout << char(196);
            else
                cout << char(1);
      else
      {
            for(int x=0;x<=79;x++)
                  {
                        if (SK[x][y] == 0)
                              if (x==39)
                                   cout << char(179);
                              else
                                   cout << " ";
                        else
                                   cout << char(1);
                  }
      }
  }

The outer loop says that you will keep printing characters until it’s the other line’s turn. While looping, it asks if y=12. It needs to know it because in the line 12 it will draw the Ox line by the following loop:

      for(int d=0;d<=79;d++)
            if (SK[d][12] == 0)
                if (d==39)
                     cout << char(197);
                else
                     cout << char(196);
            else
                cout << char(1);

This loop will keep drawing a character like – until d is 39. 39 means the middle of the x coordinate so it will draw a + to meet with the upper and lower Oy line characters witch look like this |.

If y is not 12, the program will draw the curve and other Oy characters by the following code:

            for(int x=0;x<=79;x++)
                  {
                        if (SK[x][y] == 0)
                              if (x==39)
                                   cout << char(179);
                              else
                                   cout << " ";
                        else
                                   cout << char(1);
                  }

That’s all. Here’s a screenshot of the sine wave drawn this program.




The full project in Dev-C++ will be attached.

Thanks,
Dren.

[WingedPanther]

Very nice! It's a pleasure to see someone posting math stuff on here.

[Jordan]

Very nice tutorial indeed! +rep and welcome back.

[RemCom]

nice

[Egz0N]

good tutorial Dren .. +rep when it lets me to ..

[Dren]

Thank you all. It would be great if someone would give me any cool ideas of inputing the function as a string(so I wouldn't have to compile the code every time I change the function).

Thanks again,
Dren

[chili5]

Now that is super cool!!! Nice job!!!

[WingedPanther]

I might try writing a parser for a string.

[Dren]

I might try writing a parser for a string.

Thank you WingedPanther, I really didn't know what a parser is but I read it in Wikipedia. Is it going to be complex? Could you please tell me how to do that?

Thanks again

[WingedPanther]

Writing one is a little tricky... I'd probably borrow (read steal) heavily from Bjarne Stroustrup's work in The C++ Programming Language.