Help....mapping function - changing a value to a R,G,B Color

This has to have been discussed a million time, but I cant seem to find any info on it.

If I have a set of values (say 3,6,8…whatever) and a min/max range (say 0-10) how can I map this to a color range? For example
x = 0 = blue (rgb = 0,0,1)
x = 10 = red (rgb = 1,0,0)

red = f(x) = ???
green = f(x) = ???
blue = f(x) = ???

Even if someone could tell me a keyword to seach for I would be grateful…I just cant find anything.


It’s totally up to you how you map the values to colors. You could have a simple lookup table and use the numbers to index the colors in the table. Or you could use only a certain range of bits of the number as red component, then another range of bits for the blue component and so on.
It’s totally up to you what you do and depends on what you want to achieve.

Surely there must be a simple algorthm out there for this?

I could say 0-10 is my range and then just use

Red = value / range (ie 0-1)
Blue = (10-value) / range (ie 1-0)

Thus a value of 0 = blue, and 10 = red

But where does green come in?

I’m afraid you’re not giving enough details because I can’t see where you’re going to.

Where the “0-10” values come from ? Do you have a picture with a limited palette, and so forth every pixel of the picture represents an index between 0 and 10 ?

And where do you want to use the RGB value ? Directly in the framebuffer for rendering ? In a texture ? Somewhere else that is not connected to OpenGL ?

Sorry, Im mapping terain heights (but the variable could be pressure, force, speed, stress, whatever). My values go from 500 to about 5000. Obviously I can scale my data from 0-1. I just want a mapping function that makes a value of 0 blue and 1 red. You see this all the time in commerical software like TECPLOT.

Heres an example of what Im looking for:

use a 1d texture

You need to decide where green comes in and design the mapping accordingly.

Max green intensity shall be at 0,5 (on the [0;1] scale).

float value=whatever; //input
float r,g,b; //output

if (value<=0.5) //fade between red and green
   float fade=2*value;
   float fade=2*(value-0.5f);

If you only want to fade red/blue without green, you obviously need no branches and don’t need the fade var. If you want additional colors (say, your spectrum ends with purple as in visible light), add more branches, segment and scale the input range according to your needs.
Shouldn’t be too hard

Ok…Im getting the picture…thanks this is what I was looking for, but is this really the way people do it? Seems like everyone could end up with slightly diffrent scale (which I guess they do). You think someone who publish some kind of standard.

1D textures is the way to go.

I’ve got a demo (with source code) that I can send to you by email if you’re interested.