Random Color generator in Javascript

Question

Hi there,

i am not an Javascript and i need a little help. Given this function , i want to replace the color with an Random Color generator.

document.overlay = GPolyline.fromEncoded({color: "#0000FF",
                                          weight: 10,
                                          points: encoded_points,
                                          zoomFactor: 32,
                                          levels: encoded_levels,
                                          numLevels: 4
                                         });

Can anyone help me ?

Answer 1

this can be very easily found on google.

function random_color(format)
{
 var rint = Math.round(0xffffff * Math.random());
 switch(format)
 {
  case 'hex':
   return ('#0' + rint.toString(16)).replace(/^#0([0-9a-f]{6})$/i, '#$1');
  break;

  case 'rgb':
   return 'rgb(' + (rint >> 16) + ',' + (rint >> 8 & 255) + ',' + (rint & 255) + ')';
  break;

  default:
   return rint;
  break;
 }
}

Answer 2

Use get_random_color() in place of "#0000FF":

function get_random_color() {
    var letters = '0123456789ABCDEF'.split('');
    var color = '#';
    for (var i = 0; i < 6; i++ ) {
        color += letters[Math.round(Math.random() * 15)];
    }
    return color;
}

Answer 3

Here's a twist on solution provided by @Anatoliy I needed to generate only light colours (for backgrounds) so I went with 3 letter (#AAA) format.

function get_random_color() {
var letters = 'ABCDE'.split('');
var color = '#';
for (var i=0; i<3; i++ ) {
    color += letters[Math.floor(Math.random() * letters.length)];
}
return color;

}

Answer 4

No need for a hash of hexadecimal letters, Javascript can do this by itself:

function get_random_color() {
  function c() {
    return Math.floor(Math.random()*256).toString(16)
  }
  return "#"+c()+c()+c();
}

Answer 5

So whilst all the answers here are good I wanted a bit more control over the output. For instance I'd like to prevent any near white shades, whilst ensuring I get bright vibrant colours not washed out shades.

function generateColor(ranges) {
            if (!ranges) {
                ranges = [
                    [150,256],
                    [0, 190],
                    [0, 30]
                ];
            }
            var g = function() {
                //select random range and remove
                var range = ranges.splice(Math.floor(Math.random()*ranges.length), 1)[0];
                //pick a random number from within the range
                return Math.floor(Math.random() * (range[1] - range[0])) + range[0];
            }
            return "rgb(" + g() + "," + g() + "," + g() +")";
        };

So now I can specify 3 arbitrary ranges to pick rgb values from. You can call it with no arguments and get my default set which will usually generate a quite vibrant colour with once obvious dominant shade, or you can supply your own array of ranges.