Search code examples
c#colorsgradientrgbcolor-theory

Ordering Color by Hex Value


I'm not sure how to classify this question, nor explain it effectively, but I'll do my best.

I have a series of random Hex code values gathered from my app.

I want to present these colors in a gradient, that will (in theory) show the prominence of one group of colors.

As in, if in my random array of colors there are more blue shades, then putting it into this gradient will reflect that.

But first, I need to "order" the colors in the gradient to be next to like colors.

I'm using C# -- but moreso just after the theory on how to map/order/group Hex color values together.


Solution

  • Thanks for the comments, I used the Hue method as commented, which results in the below -- which is works great, as you can see shows that there were more Blue colors in my List of colors (which is set dynamically) so thanks again.

    BUT there is still a bug in it -- it's repeating instead of taking up the entire height for some reason :( (should only be 1 Linear from blues to reds)

    (I'll open another question for this).

    LinearGradientBrush

    My code was as follows (ColorFromString was a method I wrote for this question):

    private Color[] OrderColorByHue(List<string> colors)
    {
      foreach(string c in colors)
      {
        Color color = ColorFromString(c); // This was defined in another question of mine :)
        float hue = color.GetHue();
    
        hueColors.Add(new KeyValuePair<Color, float>(color, hue));
      }
    
      hueColors.Sort((color1, color2) => color2.Value.CompareTo(color1.Value));
      Color[] value = hueColors.Select(color => color.Key).ToArray();
    
      return value;
    }
    

    Hope this helps someone else :)