Please fill all widget settings!

Awesome RGB Colour Scale Values from 1-100 (great for heatmaps)


A lot of people struggle with constructing heatmaps, because most values are normalized over 100 and it takes a lot of grief to figure out how to evenly step the colours from 1 to 100. After a lot of faulty experimentation I ended up hard coding the following:

Output as follows:

0,0,255
0,1,255
0,2,255
0,4,255
0,5,255
0,7,255
0,9,255
0,11,255
0,13,255
0,15,255
0,18,253
0,21,251
0,24,250
0,27,248
0,30,245
0,34,243
0,37,240
0,41,237
0,45,234
0,49,230
0,53,226
0,57,222
0,62,218
0,67,214
0,71,209
0,76,204
0,82,199
0,87,193
0,93,188
0,98,182
0,104,175
0,110,169
0,116,162
7,123,155
21,129,148
34,136,141
47,142,133
60,149,125
71,157,117
83,164,109
93,171,100
104,179,91
113,187,92
123,195,73
132,203,63
140,211,53
148,220,43
156,228,33
163,237,22
170,246,11
176,255,0
183,248,0
188,241,0
194,234,0
199,227,0
204,220,0
209,214,0
213,207,0
217,200,0
221,194,0
224,188,0
227,181,0
230,175,0
233,169,0
236,163,0
238,157,0
240,151,0
243,145,0
244,140,0
246,134,0
248,129,0
249,123,0
250,118,0
251,112,0
252,107,0
253,102,0
254,97,0
255,92,0
255,87,0
255,82,0
255,78,0
255,73,0
255,68,0
255,64,0
255,59,0
255,55,0
255,51,0
255,47,0
255,43,0
255,39,0
255,35,0
255,31,0
255,27,0
255,23,0
255,20,0
255,16,0
255,13,0
255,10,0
255,8,0
255,3,0
  1. <html>
  2. <?
  3. //define the colours from 0 to 100
  4. $h = array();
  5. //BLUEST
  6. $h[] = '0,0,255';
  7. $h[] = '0,1,255';
  8. $h[] = '0,2,255';
  9. $h[] = '0,4,255';
  10. $h[] = '0,5,255';
  11. $h[] = '0,7,255';
  12. $h[] = '0,9,255';
  13. $h[] = '0,11,255';
  14. $h[] = '0,13,255';
  15. $h[] = '0,15,255';
  16. $h[] = '0,18,253';
  17. $h[] = '0,21,251';
  18. $h[] = '0,24,250';
  19. $h[] = '0,27,248';
  20. $h[] = '0,30,245';
  21. $h[] = '0,34,243';
  22. $h[] = '0,37,240';
  23. $h[] = '0,41,237';
  24. $h[] = '0,45,234';
  25. $h[] = '0,49,230';
  26. $h[] = '0,53,226';
  27. $h[] = '0,57,222';
  28. $h[] = '0,62,218';
  29. $h[] = '0,67,214';
  30. $h[] = '0,71,209';
  31. $h[] = '0,76,204';
  32. $h[] = '0,82,199';
  33. $h[] = '0,87,193';
  34. $h[] = '0,93,188';
  35. $h[] = '0,98,182';
  36. $h[] = '0,104,175';
  37. $h[] = '0,110,169';
  38. $h[] = '0,116,162';
  39. $h[] = '7,123,155';
  40. $h[] = '21,129,148';
  41. $h[] = '34,136,141';
  42. $h[] = '47,142,133';
  43. $h[] = '60,149,125';
  44. $h[] = '71,157,117';
  45. $h[] = '83,164,109';
  46. $h[] = '93,171,100';
  47. $h[] = '104,179,91';
  48. $h[] = '113,187,92';
  49. $h[] = '123,195,73';
  50. $h[] = '132,203,63';
  51. $h[] = '140,211,53';
  52. $h[] = '148,220,43';
  53. $h[] = '156,228,33';
  54. $h[] = '163,237,22';
  55. $h[] = '170,246,11';
  56. $h[] = '176,255,0';
  57. $h[] = '183,248,0';
  58. $h[] = '188,241,0';
  59. $h[] = '194,234,0';
  60. $h[] = '199,227,0';
  61. $h[] = '204,220,0';
  62. $h[] = '209,214,0';
  63. $h[] = '213,207,0';
  64. $h[] = '217,200,0';
  65. $h[] = '221,194,0';
  66. $h[] = '224,188,0';
  67. $h[] = '227,181,0';
  68. $h[] = '230,175,0';
  69. $h[] = '233,169,0';
  70. $h[] = '236,163,0';
  71. $h[] = '238,157,0';
  72. $h[] = '240,151,0';
  73. $h[] = '243,145,0';
  74. $h[] = '244,140,0';
  75. $h[] = '246,134,0';
  76. $h[] = '248,129,0';
  77. $h[] = '249,123,0';
  78. $h[] = '250,118,0';
  79. $h[] = '251,112,0';
  80. $h[] = '252,107,0';
  81. $h[] = '253,102,0';
  82. $h[] = '254,97,0';
  83. $h[] = '255,92,0';
  84. $h[] = '255,87,0';
  85. $h[] = '255,82,0';
  86. $h[] = '255,78,0';
  87. $h[] = '255,73,0';
  88. $h[] = '255,68,0';
  89. $h[] = '255,64,0';
  90. $h[] = '255,59,0';
  91. $h[] = '255,55,0';
  92. $h[] = '255,51,0';
  93. $h[] = '255,47,0';
  94. $h[] = '255,43,0';
  95. $h[] = '255,39,0';
  96. $h[] = '255,35,0';
  97. $h[] = '255,31,0';
  98. $h[] = '255,27,0';
  99. $h[] = '255,23,0';
  100. $h[] = '255,20,0';
  101. $h[] = '255,16,0';
  102. $h[] = '255,13,0';
  103. $h[] = '255,10,0';
  104. $h[] = '255,8,0';
  105. $h[] = '255,3,0';
  106. $x=100;
  107. $y=100;
  108. for ($i = 0; $i < 100; $i++)
  109. {
  110. $rgb = 'rgb(' . $h[$i] . '); ';
  111. echo '<div style="background:'. $rgb . ' width:100%; height:10px; display:block; border-bottom:1px dotted grey">&nbsp;</div>';
  112. }
  113. ?>
  114. </html>


Share
Tags
Written by Dre


Comments (One comment)

  • November 3, 2013 at 6:26 PM

    You should just use HSV and vary the hue by a set amount. That will give you something that looks quite nice.

  • Leave a Reply