Introduction

This article explains how to use the SetPixel method to draw some mathematical functions. I created a MathGraph project under C# (2003) to draw the following functions:
  • f(X) = x^2
  • f(X) = X^3
  • f(X) = sin(X)
  • f(X) = cos(X)
  • f(X) = |X^2- 4|
  • f(X) = |sin(X)|
The MathGraph project has one form (frmGraph) with the following Controls:
  • ListBox control (lstFunction) to select a function.
  • Label control (lblFunctionName) to display function definition.
  • PictureBox control (PicView) to display function graph, this control has background image from the file (..\..\images\Axis.jpg).
  • Button control (btnDraw) to draw the function graph.
  • Button control (btnExit) to close the program.
mathgraph

The Code
  1. // Variables of my program
  2. private ArrayList PointArray = new ArrayList(); // series of points
  3. private int PageWidth; // Width of "ImageToDraw" Object
  4. private int PageHeight; // Height of "ImageToDraw" Object
  5. private int xCenter; // x coordinate of center
  6. private int yCenter; // x coordinate of center
  7. private Bitmap ImageToDraw;
  8. private double Pi = Math.PI; // 22/7
  10. //Set the Center coordinates and load ListBox with Functions:
  11. private void frmGraph_Load(object sender, System.EventArgs e)
  12. {
  13. //Width of "ImageToDraw" Object as Width of "PicView" control
  14. PageWidth = PicView.Width;
  15. xCenter = (int)PageWidth/2;
  16. //Height of "ImageToDraw" Object as Height of "PicView" control
  17. PageHeight = PicView.Height;
  18. yCenter = (int)PageHeight/2;
  20. // Fill ListBox
  21. lstFunction.Items.Add("Function 1");
  22. lstFunction.Items.Add("Function 2");
  23. lstFunction.Items.Add("Function 3");
  24. lstFunction.Items.Add("Function 4");
  25. lstFunction.Items.Add("Function 5");
  26. lstFunction.Items.Add("Function 6");
  27. lstFunction.SelectedIndex = 0;
  28. }
  30. // Draw the function: f(X) = X^2
  31. private void Function1()
  32. {
  33. double W = PageWidth/30;
  34. double H = PageHeight/80;
  35. // Initiate "ImageToDraw" Object with size same as "PicView" control
  36. ImageToDraw = new Bitmap(PageWidth, PageHeight);
  37. // Draw the function f(X) = X^2.
  38. for (double X = -6 ; X <= 6; X+=0.01)
  39. {
  40. double Y = Math.Pow(X, 2);
  41. // I add xCenter because the point (0,0) is (xCenter, yCenter).
  42. double PX = xCenter + W*X; // Multiply X*W to enlarge X.
  43. // I add yCenter because the point (0,0) is (xCenter, yCenter).
  44. double PY = yCenter - H*Y; // Multiply Y*H to enlarge Y.
  45. ImageToDraw.SetPixel((int)PX, (int)PY, Color.Blue);
  46. }
  47. PicView.Image = ImageToDraw;
  48. }
Summary

In this article we learned how to use the SetPixel methods to draw the curves and you can go to the source file to see the code for drawing the other functions. If you have any idea about this code, please tell me. Thanks for C# Corner team and thanks for all.