title: Best Practice for Sorting Distinct Hex Colors in R
body: <p><strong>Update:</strong> Based on answers, I am researching <code>ColorBrewer</code> and <code>Colorspace</code> R packages. Due to request, I am re-writing my original question.</p>
  
  <p><strong>Question:</strong> How to best sort individual, predefined hex colors so that similar colors are grouped together, yet ordered starting with most warm colors, to light colors to coolest colors. I wish to incorporate this in future version of <code>RanglaPunjab</code> R package</p>
  
  <p>For example <a href="https://i.stack.imgur.com/YbFwL.jpg" rel="nofollow noreferrer">Cynthia Brewer's spectral colors</a> ( reds, blues, greens, etc are together in single stream) illustrates this. </p>
  
  <p>I'm asking for Logic, rather than Code.</p>
  
  <p><a href="https://i.stack.imgur.com/YbFwL.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/YbFwL.jpg" alt="enter image description here"></a></p>
  
  <hr>
  
  <p>So far, I attempted to sort by <code>Hue</code>, <code>Hue + Value</code>, <code>Hue * Value</code>, based on this article, <a href="https://www.alanzucconi.com/2015/09/30/colour-sorting/" rel="nofollow noreferrer">https://www.alanzucconi.com/2015/09/30/colour-sorting/</a></p>
  
  <p>This question borderlines between R and Color Theory.</p>
  
  <p>Code at the end of this post sorts colors by <code>Hue</code>, <code>Hue + Value</code>, <code>Hue * Value</code> (depends on what you comment or uncomment).</p>
  
  <p>Please tell me (or give hint) on how get similar results as Cynthia Brewer's spectral colors</p>
  
  <p><code>Unordered Colors</code>:</p>
  
  <p><a href="https://i.stack.imgur.com/cF6yT.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/cF6yT.jpg" alt="enter image description here"></a></p>
  
  <p>Ordered based on <code>Hue</code>:</p>
  
  <p><a href="https://i.stack.imgur.com/D7NWZ.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/D7NWZ.jpg" alt="enter image description here"></a></p>
  
  <p>Ordered based on <code>Hue + Value</code>:</p>
  
  <p><a href="https://i.stack.imgur.com/gRk13.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/gRk13.jpg" alt="enter image description here"></a></p>
  
  <p>Ordered based on <code>Hue * Value</code>:</p>
  
  <p><a href="https://i.stack.imgur.com/qlwGE.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/qlwGE.jpg" alt="enter image description here"></a></p>
  
  <p>For Reference, here is original, unordered palette</p>
  
  <pre><code>&gt; oldPal
   [1] "#22325f" "#88ce64" "#fbd234" "#b8091f" "#682f4e" "#fdea6e" "#4aec6a" "#fb7894" "#f13111" "#2584a0"
  [11] "#6fa42c" "#db3717" "#051a8d" "#ef38a7" "#202c3d"
  </code></pre>
  
  <p>Converted to HSV, then transposed</p>
  
  <pre><code>&gt; tHSVcol
                 h         s         v
   [1,] 0.62295082 0.6421053 0.3725490
   [2,] 0.27672956 0.5145631 0.8078431
   [3,] 0.13232831 0.7928287 0.9843137
   [4,] 0.97904762 0.9510870 0.7215686
   [5,] 0.90935673 0.5480769 0.4078431
   [6,] 0.14452214 0.5652174 0.9921569
   [7,] 0.36625514 0.6864407 0.9254902
   [8,] 0.96437659 0.5219124 0.9843137
   [9,] 0.02380952 0.9294606 0.9450980
  [10,] 0.53794038 0.7687500 0.6274510
  [11,] 0.24027778 0.7317073 0.6431373
  [12,] 0.02721088 0.8949772 0.8588235
  [13,] 0.64093137 0.9645390 0.5529412
  [14,] 0.89890710 0.7656904 0.9372549
  [15,] 0.59770115 0.4754098 0.2392157
  </code></pre>
  
  <p><strong>R Code</strong> </p>
  
  <pre><code>library(RanglaPunjab)
  
  RenderPal &lt;- function(x,name){
  
    if ((missing(x)) || (missing(name))){
      stop("Internal error, please troubleshoot")
    }
    n &lt;- length(x)
    old &lt;- graphics::par(mar = c(0.5, 0.5, 0.5, 0.5))
    on.exit(graphics::par(old))
  
    graphics::image(1:n, 1, as.matrix(1:n), col = x,
                    ylab = "", xaxt = "n", yaxt = "n", bty = "n")
    graphics::rect(0, 0.9, n + 1, 1.1, col = grDevices::rgb(1, 1, 1, 0.8), border = NA)
    graphics::text((n + 1) / 2, 1, labels = name, cex = 2, family = "serif")
  }
  
  i &lt;- NULL
  oldPal &lt;- NULL
  rankorder &lt;- NULL
  orderedPal&lt;- NULL
  RGBcol &lt;- NULL
  HSVcol &lt;- NULL
  tHSVcol &lt;- NULL
  orderType &lt;- NULL
  
  # Paint the colors
  PaintPalette("Teej","Gidha","Jutti3")
  
  # Store the hex values
  oldPal &lt;- MergePalette("Teej","Gidha","Jutti3")
  
  # Print hex values
  oldPal
  
  # Convert Hex to RGB
  RGBcol &lt;- col2rgb(oldPal)
  
  # Print RGB values
  RGBcol
  
  # Convert RGB to HSV
  HSVcol &lt;- rgb2hsv(RGBcol)
  
  # Print matrix
  HSVcol
  
  # Transpose matrix
  tHSVcol &lt;- t(HSVcol)
  
  # Print matrix
  tHSVcol
  
  
  # Uncomment following to order by Hue, then Saturation, then Value
  rankorder &lt;- order(tHSVcol[,1],tHSVcol[,2],tHSVcol[,3])
  orderType &lt;- "Hue Ordering"
  
  # Uncomment following to order by hANDv = Hue + Value
  # hANDv &lt;- apply(tHSVcol[,c(1,3)],1,sum)
  # rankorder &lt;- order(hANDv)
  # orderType &lt;- "Hue + Value Ordering"
  
  # Uncomment following to order by hPRODv = Hue * Value
  # hPRODv &lt;- apply(tHSVcol[,c(1,3)],1,prod)
  # rankorder &lt;- order(hPRODv)
  # orderType &lt;- "Hue * Value Ordering"
  
  rankorder
  
  for (i in 1:length(rankorder)){
    orderedPal[i] &lt;- oldPal[rankorder[i]]
  }
  
  # Print old, unordered palette
  oldPal
  
  # Print new, ordered palette
  orderedPal
  
  RenderPal(oldPal, "Unordered Palette")
  RenderPal(orderedPal, orderType)
  </code></pre>