# Math to create color palette

This topic is 2898 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

## Recommended Posts

I have been playing with interpolation on this but can't seem to get this working right. What I want to do is be able to create color palletes by setting my own ranges for the colors and values. Say my palette goes from 0-100. and I want to set 0-93 as my range, have 93 be Dark Green and set 5 stops along the range of values. Then 94-96 as yellow with 2 stops and 97 to 100 as 3 stops with a color of red. I am tryign to create a heatmap of sorts where the developer will be able to create these palletes easily on startup and then I will write a method that will search through the palette for the value passed and return the Html color.

I had no problem doing the interpolation when my range was from 0 - 100 and passing some value. However now that I am trying to set these ranges my html color codes are always returning the same code. Anyone have any ideas? Thanks!

public static String GetInterpolatedColor(HeatMapColors minColor, HeatMapColors maxColor, Decimal currentValue, Decimal minValue = 0m, Decimal maxValue = 100.0m) { //Assign our hexMaxcolor the hex value for the color passed in var hexMinColor = GetHeatMapColorHexVal(minColor); var hexMaxColor = GetHeatMapColorHexVal(maxColor); //Calc our ratio var ratio = currentValue / maxValue ; var nRatio = 1.0m - ratio; //Perform interpolation between white and the color passed in Color temp = Color.FromArgb((int) Math.Round((ratio*hexMinColor.R) + (nRatio*hexMaxColor.R)), (int) Math.Round((ratio*hexMinColor.G) + (nRatio*hexMaxColor.G)), (int) Math.Round((ratio*hexMinColor.B) + (nRatio*hexMaxColor.B))); var retVal = ColorTranslator.ToHtml(temp); return retVal; }

##### Share on other sites
I had no problem doing the interpolation when my range was from 0 - 100 and passing some value. However now that I am trying to set these ranges my html color codes are always returning the same code. Anyone have any ideas? Thanks! [/quote]
Did you use the same method in your example when you changed the ranges? Or did you rewrite? I'm not a Java expert, but I suspect there is a floating point truncation problem somewhere. Check the intermediate results enclosed within the Math.Round() statements.

##### Share on other sites

I had no problem doing the interpolation when my range was from 0 - 100 and passing some value. However now that I am trying to set these ranges my html color codes are always returning the same code. Anyone have any ideas? Thanks!

Did you use the same method in your example when you changed the ranges? Or did you rewrite? I'm not a Java expert, but I suspect there is a floating point truncation problem somewhere. Check the intermediate results enclosed within the Math.Round() statements.
[/quote]

The rounding I'm getting is acceptable. It is just truncating and the amount of loss is minimal. The problem is I don't know how to use the minValue in my equation. The method shown only works on a 0 to 100 scale. I was trying a number of things to try and have it calculate the interp colors between the ranges passed in but I removed all that cause i felt it was jsut adding confusion to the question. At the same time I didn't include all the code I just realized and I'm sorry for that. I beleive the issue is in the code that I posted but to build the palette I am using the code below, or should I say it was the approach I was taking.

public void AddPaletteEntry(Decimal colorStartVal, Decimal colorEndVal, Int32 numTotalColorStops, HeatMapColors startHeatColor, HeatMapColors endHeatColor) { //Get how many color stops we need between colors var inc = (colorEndVal - colorStartVal)/numTotalColorStops; for (var i = colorStartVal; i <= colorEndVal; i += inc ) { var clr = CellData.GetInterpolatedColor(startHeatColor, endHeatColor, i, colorStartVal, colorEndVal); StopPoints.Add(new HeatMapPaletteEntry(i, i+inc, clr)); } }

##### Share on other sites
So after looking at this closer, the proper way was to simply subtract my minValue from both num and denom when calculating the ratio and it worked.

public static String GetInterpolatedColor(HeatMapColors minColor, HeatMapColors maxColor, Decimal currentValue, Decimal minValue = 0m, Decimal maxValue = 100.0m) { //Assign our hexMaxcolor the hex value for the color passed in var hexMinColor = GetHeatMapColorHexVal(minColor); var hexMaxColor = GetHeatMapColorHexVal(maxColor); //Calc our ratio var ratio = (currentValue-minValue) / (maxValue - minValue) ; var nRatio = 1.0m - ratio; //Perform interpolation between white and the color passed in Color temp = Color.FromArgb((int)Math.Round((ratio * hexMaxColor.R) + (nRatio * hexMinColor.R)), (int)Math.Round((ratio * hexMaxColor.G) + (nRatio * hexMinColor.G)), (int)Math.Round((ratio * hexMaxColor.B) + (nRatio * hexMinColor.B))); var retVal = ColorTranslator.ToHtml(temp); return retVal; }

• ### Game Developer Survey

We are looking for qualified game developers to participate in a 10-minute online survey. Qualified participants will be offered a \$15 incentive for your time and insights. Click here to start!

• 11
• 18
• 14
• 9
• 9