Posted By

localhorst on 01/13/09

Tagged

math
color

Versions (?)

Last Edited at 01/13/09 03:21am

Statistics

Viewed 1060 times

Favorited by 0 user(s)

Related snippets

generating color gradient in JS

/ Published in: JavaScript

see website for all information about that.
some more theory:
[color-scaling-function](http://stackoverflow.com/questions/168838/color-scaling-function)
[generate-color-for-a-power-meter-red-to-green](http://stackoverflow.com/questions/340209/generate-color-for-a-power-meter-red-to-green)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML

function RGB2Color(r,g,b)
{
  return '#' + byte2Hex(r) + byte2Hex(g) + byte2Hex(b);
}
 
function byte2Hex(n)
{
  var nybHexString = "0123456789ABCDEF";
  return String(nybHexString.substr((n >> 4) & 0x0F,1)) + nybHexString.substr(n & 0x0F,1);
}
 
 
 
 
function makeColorGradient(frequency1, frequency2, frequency3,phase1, phase2, phase3, center, width, len)
{
    if (len == undefined)      len = 50;
    if (center == undefined)   center = 128;
    if (width == undefined)    width = 127;
 
    for (var i = 0; i < len; ++i)
    {
       var red = Math.sin(frequency1*i + phase1) * width + center;
       var grn = Math.sin(frequency2*i + phase2) * width + center;
       var blu = Math.sin(frequency3*i + phase3) * width + center;
       document.write( '<font color="' + RGB2Color(red,grn,blu) + '">&#9608;</font>');
    }
}
 
// And here's the code for drawing the basic rainbow gradient.
// makeColorGradient(.3,.3,.3,0,2,4);