Other Posts in Image Editing

  1. Perlin Noise
  2. Fault Formation
  3. Cellular Textures
  4. Resizing an Image in C#
  5. Box Blur and Gaussian Blur... Sort of...
  6. Thermal Erosion
  7. Using Mid Point Displacement to Create Cracks
  8. Fluvial Erosion
  9. Creating Marble Like Textures Procedurally
  10. Procedural Textures and Dilation
  11. Converting Image to Black and White in C#
  12. Getting an HTML Based Color Palette from an Image in C#
  13. Adding Noise/Jitter to an Image in C#
  14. Creating Pixelated Images in C#
  15. Edge detection in C#
  16. Using Sin to Get What You Want... In C#...
  17. Noise Reduction of an Image in C# using Median Filters
  18. Image Dilation in C#
  19. Sepia Tone in C#
  20. Kuwahara Filter in C#
  21. Matrix Convolution Filters in C#
  22. Symmetric Nearest Neighbor in C#
  23. Bump Map Creation Using C#
  24. Normal Map Creation Using C#
  25. Creating Negative Images using C#
  26. Red, Blue, and Green Filters in C#
  27. Converting an Image to ASCII Art in C#
  28. Adjusting Brightness of an Image in C#
  29. Adding Noise to an Image in C#
  30. Adjusting the Gamma of an Image Using C#
  31. Adjusting Contrast of an Image in C#
  32. Drawing a Box With Rounded Corners in C#
  33. Anding Two Images Together Using C#
  34. Motion Detection in C#
  35. Creating Thermometer Chart in C#
  36. Colorizing a Black and White Image in C#
  37. Extracting an Icon From a File
  38. Setting the Pixel Format and Image Format of an Image in .Net
  39. Using Unsafe Code for Faster Image Manipulation
  40. Sobel Edge Detection and Laplace Edge Detection in C#

Creating Thermometer Chart in C#

6/11/2009

Have you ever had someone calling you up and saying to you that they needed a chart that looked like a thermometer today and they didn't want it to be simply an image that they update? No? Well I did the other day. So I quickly slapped together a handler to create the chart for me. Note that this isn't a nicely created piece of code but hey, I thought someone might get something out of it:

   1: public class Thermometer : IHttpHandler
   2: {
   3:     #region IHttpHandler Members 
   4:  
   5:     public bool IsReusable
   6:     {
   7:         get { return false; }
   8:     } 
   9:  
  10:     public void ProcessRequest(HttpContext context)
  11:     {
  12:         if (context.Request.QueryString["Percent"] != null)
  13:         {
  14:             int Percent = int.Parse(context.Request.QueryString["Percent"]);
  15:             int Max = int.Parse(context.Request.QueryString["Max"]);
  16:             bool Dollar = int.Parse(context.Request.QueryString["Dollars"]) == 1;
  17:             float Pixels=(float)Percent*2.15f;
  18:             Bitmap TempImage = new Bitmap(100, 270);
  19:             Graphics TempGraphics = Graphics.FromImage(TempImage);
  20:             TempGraphics.FillRectangle(Brushes.White, new Rectangle(0, 0, 100, 270));
  21:             Pen TempPen = new Pen(Color.Black);
  22:             Pen RedPen=new Pen(Color.Red);
  23:             TempGraphics.DrawArc(TempPen, 45, 230, 30, 30, 320, 260);
  24:             TempGraphics.DrawLine(TempPen, 49, 235, 49, 20);
  25:             TempGraphics.DrawLine(TempPen, 71, 235, 71, 20);
  26:             TempGraphics.DrawArc(TempPen, 49, 15, 22, 11, 180, 180);
  27:             GreyFloodFill(TempImage);
  28:             FloodFill(TempImage, Percent);
  29:             bool DrawText = true;
  30:             float Amount = Max;
  31:             for (float y = 20.0f; y < 235.0f; y += 10.75f)
  32:             {
  33:                 TempGraphics.DrawLine(TempPen, 49, y, 55, y);
  34:                 if (DrawText)
  35:                 {
  36:                     Font TempFont = new Font("Arial", 8.0f, FontStyle.Bold);
  37:                     if (Dollar)
  38:                     {
  39:                         TempGraphics.DrawString("$" + Amount.ToString(), TempFont, Brushes.Black, 5, y);
  40:                     }
  41:                     else
  42:                     {
  43:                         TempGraphics.DrawString(Amount.ToString(), TempFont, Brushes.Black, 5, y);
  44:                     }
  45:                     DrawText = false;
  46:                 }
  47:                 else DrawText = true;
  48:                 Amount -= ((Max / 100) * 5.0f);
  49:             } 
  50:  
  51:             string etag = "\"" + Percent.GetHashCode() + "\"";
  52:             string incomingEtag = context.Request.Headers["If-None-Match"]; 
  53:  
  54:             context.Response.Cache.SetExpires(DateTime.Now.ToUniversalTime().AddDays(1));
  55:             context.Response.Cache.SetCacheability(HttpCacheability.Public);
  56:             context.Response.Cache.SetMaxAge(new TimeSpan(7, 0, 0, 0));
  57:             context.Response.Cache.SetRevalidation(HttpCacheRevalidation.AllCaches);
  58:             context.Response.Cache.SetETag(etag); 
  59:  
  60:             if (String.Compare(incomingEtag, etag) == 0)
  61:             {
  62:                 context.Response.StatusCode = (int)HttpStatusCode.NotModified;
  63:                 context.Response.End();
  64:             }
  65:             else
  66:             {
  67:                 context.Response.ContentType = "image/Gif";
  68:                 TempImage.Save(context.Response.OutputStream, ImageFormat.Gif);
  69:             }
  70:         }
  71:     } 
  72:  
  73:     private void GreyFloodFill(Bitmap TempImage)
  74:     {
  75:         int RedColor = 255;
  76:         for (int y = 20; y <= 235; ++y)
  77:         {
  78:             for (int x = 50; x <= 70; ++x)
  79:             {
  80:                 float Distance = Math.Abs(60 - x);
  81:                 RedColor = (int)(255.0f * (1.0f - (Distance / 30.0f)));
  82:                 TempImage.SetPixel(x, y, Color.FromArgb(RedColor, RedColor, RedColor));
  83:             }
  84:         }
  85:     } 
  86:  
  87:     private void FloodFill(Bitmap TempImage,int Percent)
  88:     {
  89:         if (Percent == 100)
  90:         {
  91:             FillCircle(TempImage, 60, 245, 15);
  92:             FillCircle(TempImage, 60, 20, 10);
  93:             FillRectangle(TempImage, 60, 20, 235);
  94:         }
  95:         else
  96:         {
  97:             FillCircle(TempImage, 60, 245, 15);
  98:             FillRectangle(TempImage, 60, (int)(235.0f - ((float)Percent * 2.15f)), 235);
  99:         }
 100:     } 
 101:  
 102:     private void FillRectangle(Bitmap TempImage, int x, int y1,int y2)
 103:     {
 104:         int MaxDistance=10;
 105:         for (int i = x - MaxDistance; i < x + MaxDistance; ++i)
 106:         {
 107:             for (int j = y1; j < y2; ++j)
 108:             {
 109:                 float Distance = (float)Math.Abs((i - x));
 110:                 int RedColor = (int)(255.0f * (1.0f - (Distance / (2.0f * MaxDistance))));
 111:                 TempImage.SetPixel(i, j, Color.FromArgb(RedColor, 0, 0));
 112:             }
 113:         }
 114:     } 
 115:  
 116:     private void FillCircle(Bitmap TempImage, int x, int y, int MaxDistance)
 117:     {
 118:         for (int i = x - MaxDistance; i < x + MaxDistance; ++i)
 119:         {
 120:             for (int j = y - MaxDistance; j < y + MaxDistance; ++j)
 121:             {
 122:                 float Distance = (float)Math.Sqrt(((j - y) * (j - y)) + ((i - x) * (i - x)));
 123:                 if (Distance < MaxDistance)
 124:                 {
 125:                     int RedColor = (int)(255.0f * (1.0f - (Distance / (2.0f * MaxDistance))));
 126:                     TempImage.SetPixel(i, j, Color.FromArgb(RedColor, 0, 0));
 127:                 }
 128:             }
 129:         }
 130:     } 
 131:  
 132:     #endregion
 133: }

The code above is a handler that takes in a Percent (percent of the graph to show as red), Max (maximum value), and Dollars value (Whether this is a number or dollar amount). But in return it creates a decent looking graph. I mean it isn't perfect, but it works... Anyway, try it out, leave feedback, and happy coding.



Comments

Andreas
October 19, 2010 4:26 AM

thx, that's the goal

James Craig
October 18, 2010 12:52 PM

I created it as an http handler (you'd add it to your web.config under httphandlers). Since you're most likely calling it like AQEEL (which you shouldn't, but I missed his comments or I would have responded), you're running into the issue. The handler uses the Response property to fill what is sent from the page (you'll notice that your response is just the image and no html). If you set it up as an http handler and call it like this from your default.aspx:<img src="Thermometer.ashx?Percent=50*Max=100&Dollars=1" />It should run. Now you could also take out the actual thermometer generation code and just use that in its own class (generate the jpg on the fly, or daily, or whatever). That's another option.

Andreas
October 18, 2010 10:18 AM

hi, great control, but i got a problem. i've got a default.aspx with a menu and a table where the image with the process request is in. but when i run the solution only the the thermometer is displayed and the menu and other controls get lost ?please helpthx

AQEEL
November 25, 2009 7:05 PM

use like thisin Default.aspx on load event type following Thermometer tm = new Thermometer();tm.ProcessRequest(HttpContext.Current);and call default.aspx?Percent=50&Max=100&Dollars=5000

AQEEL
November 25, 2009 6:12 PM

Hi There, just want to say awesome, at least i can know how to work with graphics, just one question how do i call it?