HSV to RGB conversion problem [Archive]

magneeto

12-08-2008, 10:24 PM

hi,

i need an explanation on the algorithm to convert colors in HSV model to RGB model. all the algorithms that i have seen assign the following values to RGB in different regions of the hexacone

h /= 60; // sector 0 to 5
i = floor( h );
f = h - i; // factorial part of h

p = v * ( 1 - s );
q = v * ( 1 - s * f );
t = v * ( 1 - s * ( 1 - f ) );

switch( i ) {
case 0:
*r = v; *g = t; *b = p;
break;
case 1:
*r = q; *g = v; *b = p;
break;
case 2:
*r = p; *g = v; *b = t;
break;
case 3:
*r = p; *g = q; *b = v;
break;
case 4:
*r = t; *g = p; *b = v;
break;
default: // case 5:
*r = v; *g = p; *b = q;
break;
}
i can't understand the mapping of p,q and t and also how they are calculated. an explanation is very much appreciated. thank you.

Reedbeta

12-08-2008, 10:34 PM

For future reference, please use ... tags when posting code on the forum; it keeps the formatting and makes things easier to read.

As for the numbers, the mapping may look arbitrary but it's not hard to figure out if you just keep the six sectors of the color wheel in your mind.

For instance, look at the case for sector 0, meaning hue goes from 0 to 60. Now keep in mind that hue=0 is red, and hue=60 is yellow. So, we should see the value interpolating from red to yellow as we change the hue. Let's imagine saturation and value are both 1 for now, to keep things simple. Then, you see that p = 0, q = 1 - f, and t = f. Here, f is a number that goes from 0 to 1 over the length of the sector, i.e. it's 0 at red and 1 and yellow.

Then the assignment r = v, g = t, b = p just boils down to r = 1, g = f, b = 0. As you see this does exactly what it's supposed to since it interpolates from red (rgb = 1, 0, 0) to yellow (rgb = 1, 1, 0) as f goes from 0 to 1 (in other words, as hue goes from 0 to 60).

Now we can put back in the saturation component. This can be described as taking the pure hue (some mixture of red and yellow) and interpolating it towards white. So we get r = 1, g = 1 - s*(1 - f), b = 1 - s. When s = 1, this is the same as before, but as s decreases to zero, this will move toward white.

Now we can put back in the value component - this is simple; we just multiply everything by v. So then we have r = v, g = v * (1 - s*(1 - f)), b = v * (1 - s). And that is what the assignment r = v, g = t, b = p gives us.

You can extend this to the other sectors pretty easily by just thinking about which colors lie at the boundaries of those sectors. Each sector has one color channel that is present in all hues in that sector, and this will be assigned 'v'. The other color channel necessary for that sector's hues is assigned either 'q' or 't', depending on whether it's going up or down ('q' and 't' are the same except for one going up with 'f' and the other going down). The last color channel in each sector is assigned 'p', since it is only needed to move toward white when the saturation goes down.

Hope this helps.