How do I use GDI+ to change the color of a line when it overlaps a region?

Question

I'm using .NET GDI+ to draw a wavy line on a chart. (think sharetrading) I want it to change color if the line goes above 90% or below 10%.

Any tips on how to get the color to change?

My two ideas are:- 1. Create rectangles from 0%-10% & 90%-100% & somehow use them are a color clipping/transform region. is that possible if so how. 2. Use a Brush but these seem to be more of a gradient & not a definate color switch precicely at a value.

Are either of these viable? Is there a better way?

Answer 1

Both methods seem viable.

To do your first method, define three Region or Rectangle objects for the three ranges in your graph, and then make three Pen objects, each with a different color. Call the Graphics.SetClip method for the first region, and draw your entire curve using the first pen. Anything outside the current clipping region won't show up, so you don't have to worry about figuring out the intersection points yourself. Then set the clipping region to the second region and draw the entire curve again using the second pen. Repeat using the third region and pen.

For your second method, create a Bitmap with the full height of your drawing area, with any width. Paint the entire bitmap with the color regions you want. Define a textured brush and use it to create you pen. Then draw the entire path at once. MSDN has an example.

Answer 2

Thanks Rob, I really appreciated your reply. While testing it out. I found an alternate that was even simpler for what I needed. I hope you find this useful too.

The Blend Object is lets you create an array of Positions X% of the way from start to finish. You also create a matching array of Percent mix of the colors at that point eg: 0= all one colour & 1= all the other. I then created a Brush that was exactly the same height as my chart. I then set the Blend property of the Brush to my Blend object. And Created a Pen using the Brush.

This let me draw the line anywhere once, as it passed the height of my Blend transition points it magically changed colour.

if (enableThresholdColors) {    // Color the extreme values a different color 

   int Threshold = (thresholdValue < 50 ? 100 - thresholdValue : thresholdValue);
   float UpperThreshold = ((float) Threshold) / 100f;
   float LowerThreshold = ((float) 100 - Threshold) / 100f;

   LinearGradientBrush br = new LinearGradientBrush(new Rectangle(20, bounds.Top, 30, bounds.Height ), Plots[0].Pen.Color, colorThreshold, 90); 
   Blend bl = new Blend();
   // --- this colors the Extreme values the same color ---  
   bl.Factors = new float[]  {1.0f, 1.0f, 0.0f, 0.0f, 1.0f, 1.0f};
   // --- this colors the Extreme values the opposite color & transitions the line ---
   //    bl.Factors = new float[]  {1.0f, 1.0f, 0.0f, 1.0f, 0.0f, 1.0f}; 

   bl.Positions = new float[]{0,  LowerThreshold, LowerThreshold, UpperThreshold, UpperThreshold, 1.0f}; 
   br.Blend = bl; 
  // --- for testing - show where the threshold is. ---
  //    graphics.FillRectangle( br, new Rectangle(50, bounds.Top, 400,  bounds.Height)); 

//---------------------------------------------------------------------------------------

   Pen stocPen = new Pen(br, Plots[0].Pen.Width);
   stocPen.DashStyle = Plots[0].Pen.DashStyle;
   graphics.DrawPath(stocPen, path);
   stocPen.Dispose();
   br.Dispose();

} else {    // Color the entire line all the same color
   graphics.DrawPath(Plots[0].Pen, path);
}