The end result (for the Tangent) is in the illustration below:
--------
Click Here to display the illustration
Click the Back button on your browser to return
--------
The Load event establishes two constant values based on the dimensions of Panel control. TrigBoxInterval gives you one Point per degree. TrigBoxMidPoint gives you a starting point in the middle of the Panel control. The "- 1" adjusts for the thickness of the line and keeps it inside the Panel.
In general, the Paint event for a GDI+ program should do nothing except paint graphics. PaintTrig_Paint does exactly that. Any code in this event will execute whenever the PaintTrig Panel needs to be refreshed and if you have code there that doesn't have to be there, it can slow down your program a lot. Keep in mind that Windows normally decides when an object needs to be refreshed. This can happen because you change it (maximize or minimize, for example) or you move a different object and cover or uncover it. In this program, the trig functions are initially drawn by forcing a Refresh as the last statement in each of the trig function calculation subroutines (SineButton_Click, CosineButton_Click, and TangentButton_Click).
To make the curves as smooth as possible, the Point objects are declared as floating point ...
Dim TrigPoints(359) As PointF
... and the curve itself is created using the DrawCurve method and the 360 Point objects in the TrigPoints array.
e.Graphics.DrawCurve(P, TrigPoints)
Most of the rest of the code is there to calculate the actual Point values. Each one consists of an X value and a Y value. In the case of the sine, for example ...
TrigPoints(Counter) = _
New Point(Round( _
Counter * TrigBoxInterval), _
TrigBoxMidPoint - TrigBoxMidPoint _
* Sin(PI * Counter / 180))
TrigBoxInterval is the width of 1/360 of the width of the panel. So Counter multiplied by the value is the X position of a Point. If you remember your trigonometry and algebra from high school, this will seem normal to you.
But the Y position won't seem normal. The coordinate system of GDI+ measures down from the top left corner. This means that subtracting from the starting midpoint will make the curve go up for positive values and down for negative ones. You often have to reverse your thinking for the Y position in GDI+. And .NET expects the angle to be expressed in radians, so you have to multiply by PI/180 to use degrees.
The tangent calculation introduces one final problem. The values of Tan(90) and Tan(270) are infinite. If you calculate the same way sine and cosine are done, an overflow exception stops the program. So the whole thing has to be placed inside a Try - Catch block and the Y value of the top and bottom of the panel is used instead. The direction of the overflow is determined by comparing it to a midpoint. And the magic number "4" in the calculation? I picked it out of the air to make the curve look better.
In Part 3 of the tutorial, we work with bit mapped graphics by coding a "different" way to display an image: brush the image onto a line!
