Shaded Graph
If you want a chart that looks like this:
then you can achieve this effect with a minor code tweak. Replace Step 6 in the DrawGuidelinesAndChart procedure with the code block below:
' Step 6
' Draw the next line segment on the Graphics object.
gr.DrawLine(Pens.Black, _
picGraph.Width - 1 - Xmove, -OldValue, _
picGraph.Width - 1, -NewValue)
OldValue = NewValue
' Draw another line segment, but this time leave the Y value of
' OldValue as positive.
gr.DrawLine(Pens.LightBlue, _
(picGraph.Width - 1) - Xmove, OldValue, _
picGraph.Width - 1, -NewValue)
OldValue = NewValue
As you can see, the only change is a second sub block which uses Drawline again to draw a second line segment on the Graphics object. The difference here is that the start point of this segment is the positive value of OldValue, which you will recall means that it is located down below the bottom of the PictureBox. So drawing this second line has the effect of creating a line that runs from the bottom of the PictureBox up until it meets the point where we plotted the negative value of NewValue.
Sounds complicated at first, I know, but if you step through it a line at a time I hope it will make sense.
Or something a bit more striking:
Again, this requires just a small edit to Step 6. This time though, instead of drawing lines, we draw a polygon. The top of the polygon is a line that is exactly the same line as we have drawn in the previous examples; the remainder of the polygon is created by drawing two vertical lines down from either end of this line to the bottom of the PictureBox, plus a horizontal line along the bottom.
The FillPolygon method takes these four points and draws a polygon shape filled with our choice of color.
Here's the replacement Step 6:
' Step 6
' Draw Polygon to fill areas below the plotted line.
Dim topLeft As New Point((picGraph.Width - 1) - Xmove, -OldValue)
Dim topRight As New Point((picGraph.Width - 1), -NewValue)
Dim bottomRight As New Point(picGraph.Width - 1, picGraph.Height)
Dim bottomLeft As New Point((picGraph.Width - 1) - Xmove, picGraph.Height)
Dim PolyPoints As Point() = {topLeft, topRight, bottomRight, bottomleft}
gr.FillPolygon(Brushes.Red, PolyPoints)
OldValue = NewValue
One final variation for you to try out:
The amended Step 6 looks like this:
' Step 6
' Draw Polygon to fill areas below the plotted line.
Dim topLeft As New Point((picGraph.Width - 1) - Xmove, -OldValue)
Dim topRight As New Point((picGraph.Width - 1), -NewValue)
Dim bottomRight As New Point(picGraph.Width - 1, picGraph.Height)
Dim bottomLeft As New Point((picGraph.Width - 1) - Xmove, picGraph.Height)
Dim PolyPoints As Point() = {topLeft, topRight, bottomRight, bottomLeft}
Dim hb As New Drawing.Drawing2D.HatchBrush(Drawing2D.HatchStyle.Trellis, Color.Black, Color.White)
' Alternative: Uncomment this line for a more subtle version:
' It changes the ForeColor and BackColor properties for more variations gr.FillPolygon(hb, PolyPoints)
OldValue = NewValue
You can play around with variations of these for hours! If you want a less jagged effect on the plotted lines, try increasing the value of XMove.