Calculate a color which sits between 2 colors?

Question

I need to visualize a list of numbers, this list is generated every x minutes. I currently use a single line with numbers at the side. This works correctly, but while doing live analysis it becomes hard on the eyes.

After thinking a bit i came up with the idea of color coding the numbers, a large negative number is red and a large positive number is green, a normal positive number is light green, slightly bigger than normal number sits between green and light green.

To illustrate it i made a image:

enter image description here

To my question. If for example we have:

50: Color.green
0: Color.white
-50: Color.red

How can i calculate the color that represents 25?

Are you representing the color using RGB (or other colors encoding) or it's just a convention? — araknoid, Aug 01 '13 at 14:49

TheCodeArtist · Accepted Answer · 2013-08-02T00:57:01.960

For strictly linear representation between red <--> white <--> green,

import java.awt.Color;

/* Define the MAXIMUM saturation of RED and GREEN shades
 * Range (0-255)
 */
final int RED_MAX = 255;
final int GREEN_MAX = 255;

/* input val varies from -MAX to MAX */

/* output valColor varies from
 * -MAX = red
 *         ^
 *         |
 *         v
 *    0 = white
 *         ^
 *         |
 *         v
 *  MAX = green
 */

/* Normalised normVal varies from -255 to 255 */
normVal = (val*255)/MAX

if(val < 0) {
    /* Make it red-ish */
    valColor = new Color( RED_MAX,
                          255 + normVal, 
                          255 + normVal );
} else if (val > 0) {
    /* Make it green-ish */
    valColor = new Color( 255 - normVal), 
                          GREEN_MAX,
                          255 - normVal );
} else {
    /* Absolute White */
    valColor = new Color( 255, 255, 255 );
}

Thank you for your suggestion, it looks like a good solution, I'm going to give it a try tomorrow. Also thumbs up to Danny and Chris! — TinusSky, Aug 01 '13 at 16:35

score 1 · Answer 2 · edited May 23 '17 at 10:25

1

I think this existing question should give you something close to what you're looking for:

Generate colors between red and green for a power meter?

edited May 23 '17 at 10:25

Community

1
1

answered Aug 01 '13 at 14:52

Danny Thomas

1,879
1
18
32

You can not apply that as between green and red is yellow. So it is more a comment than answer. – Damian Leszczyński - Vash Aug 01 '13 at 14:54
@Vash why yes he can, if he will also alter saturation as `1.8*Math.abs(power-0.5)`. – Vesper Aug 01 '13 at 15:09

Chris Kessel · Answer 3 · 2013-08-01T15:55:00.740

I wrote something very similar, maybe this will help. It's been a while, so I don't recall exactly why I did what I did, but I tried for a couple variants of each color (e.g. dark red and light red). Based on the number of colors desired, I'd start near one end of the spectrum (the hue) and "gap" down to the other end of the spectrum where the gap depended on how many colors I needed. So, if you need 10 unique colors it'd split the spectrum into 1/5ths and pick a light and dark of each 5th.

Not sure if that makes sense, but hopefully it helps.

import java.awt.Color;
import java.util.ArrayList;
import java.util.List;

public class ColorPicker
{
  public static List<Color> chooseDistinguishableColors( int numberOfColors )
  {
    List<Color> colors = new ArrayList<>();
    float gap = 1.0f / (float) ((numberOfColors / 2) + (numberOfColors % 2));
    for ( int i = 0; colors.size() < numberOfColors; i++ )
    {
      float hue = i * gap;
      colors.add( new Color( Color.HSBtoRGB( hue, 1.0f, 0.90f ) ) );
      colors.add( new Color( Color.HSBtoRGB( hue, 1.0f, 0.65f ) ) );
    }
    return colors;
  }
}

Calculate a color which sits between 2 colors?

3 Answers3