graphical color interpolation

[Victor]

Hi,

I am a newbie in the C# graphical arena and I have the following
problem. I have a 2D disk in which I have a few points, each point
having x, y coordinates and also a value associated with it which
represents profit (or loss). What I want to do is to create a
background with a gradient going from red to green which reflects the
values of the existing points. I need to mention that the points do
not follow a linear gradient or any type of pattern.

Thanks,
Victor.

 

[Ben Voigt [C++ MVP]]

Hi,

I am a newbie in the C# graphical arena and I have the following
problem. I have a 2D disk in which I have a few points, each point
having x, y coordinates and also a value associated with it which
represents profit (or loss). What I want to do is to create a
background with a gradient going from red to green which reflects the
values of the existing points. I need to mention that the points do
not follow a linear gradient or any type of pattern.

Does this graph have to update in realtime? If not, then it is very
straightforward to set each pixel individually. I suggest each pixel is a
weighted average of all the points, where the weight is proportional to
Math.Exp(r, -n) where r is the distance between the pixel and the point and
n is a constant somewhere around 1.5, chosen to make the graph look good.

 

[Victor]

Does this graph have to update in realtime? If not, then it is very
straightforward to set each pixel individually. I suggest each pixel is a
weighted average of all the points, where the weight is proportional to
Math.Exp(r, -n) where r is the distance between the pixel and the point and
n is a constant somewhere around 1.5, chosen to make the graph look good.

Thanks Ben. One more question. How do you set one pixel at a time?
Just draw a line with the same start and end point?

 

[Ben Voigt [C++ MVP]]

Thanks Ben. One more question. How do you set one pixel at a time?
Just draw a line with the same start and end point?

The Bitmap class has a SetPixel method. You could also create a uint[,]
representing the color values (I'd suggest PixelFormat.Format32bppPArgb for
this task) and use the Bitmap constructor that accepts a pointer. Then use
DrawImage to paint the whole Bitmap to the screen at once.

Something like this should work:

uint[,] pixels = new uint[w,h];
// fill in values
pinned (uint* p = pixels) {
return new Bitmap(w, h, w * 4, new IntPtr(p));
}

 

[Victor]

Thanks Ben. One more question. How do you set one pixel at a time?
Just draw a line with the same start and end point?

The Bitmap class has a SetPixel method. You could also create a uint[,]
representing the color values (I'd suggest PixelFormat.Format32bppPArgb for
this task) and use the Bitmap constructor that accepts a pointer. Then use
DrawImage to paint the whole Bitmap to the screen at once.

Something like this should work:

uint[,] pixels = new uint[w,h];
// fill in values
pinned (uint* p = pixels) {
return new Bitmap(w, h, w * 4, new IntPtr(p));



}- Hide quoted text -

- Show quoted text -- Hide quoted text -

- Show quoted text -

Thanks again Ben. One more question. In your first reply you said that
"the weight is proportional to
Math.Exp(r, -n) " but Math.Exp() only takes one parameter. Can you
please clarify what you meant? Other than that, creating the bitmap
the way you suggested works great.

 

[Ben Voigt [C++ MVP]]

I am a newbie in the C# graphical arena and I have the following
problem. I have a 2D disk in which I have a few points, each point
having x, y coordinates and also a value associated with it which
represents profit (or loss). What I want to do is to create a
background with a gradient going from red to green which reflects
the
values of the existing points. I need to mention that the points do
not follow a linear gradient or any type of pattern.

Does this graph have to update in realtime? If not, then it is very
straightforward to set each pixel individually. I suggest each pixel
is
a
weighted average of all the points, where the weight is proportional
to
Math.Exp(r, -n) where r is the distance between the pixel and the
point
and
n is a constant somewhere around 1.5, chosen to make the graph look
good.

Thanks Ben. One more question. How do you set one pixel at a time?
Just draw a line with the same start and end point?

The Bitmap class has a SetPixel method. You could also create a uint[,]
representing the color values (I'd suggest PixelFormat.Format32bppPArgb
for
this task) and use the Bitmap constructor that accepts a pointer. Then
use
DrawImage to paint the whole Bitmap to the screen at once.

Something like this should work:

uint[,] pixels = new uint[w,h];
// fill in values
pinned (uint* p = pixels) {
return new Bitmap(w, h, w * 4, new IntPtr(p));



}- Hide quoted text -

- Show quoted text -- Hide quoted text -

- Show quoted text -

Thanks again Ben. One more question. In your first reply you said that
"the weight is proportional to
Math.Exp(r, -n) " but Math.Exp() only takes one parameter. Can you
please clarify what you meant? Other than that, creating the bitmap
the way you suggested works great.

oops, meant Math.Pow, which computes an exponent.

 

[Bob Powell [MVP]]

You could potentially use the points that you have as factors in a
ColorBlend. You'd need to normalise them by ensuring that their values
were between 0 and 1. See the beginners guide to GDI+ for more in-depth
discussion of the ColorBlend object.

--
Bob Powell [MVP]
Visual C#, System.Drawing

Ramuseco Limited .NET consulting
http://www.ramuseco.com

Find great Windows Forms articles in Windows Forms Tips and Tricks
http://www.bobpowell.net/tipstricks.htm

Answer those GDI+ questions with the GDI+ FAQ
http://www.bobpowell.net/faqmain.htm

All new articles provide code in C# and VB.NET.
Subscribe to the RSS feeds provided and never miss a new article.