鉴于此功能，我想用随机颜色生成器替换颜色。
document.overlay = GPolyline.fromEncoded({
color: "#0000FF",
weight: 10,
points: encoded_points,
zoomFactor: 32,
levels: encoded_levels,
numLevels: 4
});
我该怎么做？
答案 0 :(得分：859)
使用getRandomColor()代替"#0000FF"：
function getRandomColor() {
var letters = '0123456789ABCDEF';
var color = '#';
for (var i = 0; i < 6; i++) {
color += letters[Math.floor(Math.random() * 16)];
}
return color;
}
function setRandomColor() {
$("#colorpad").css("background-color", getRandomColor());
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="colorpad" style="width:300px;height:300px;background-color:#000">
</div>
<button onclick="setRandomColor()">Random Color</button>
答案 1 :(得分：224)
我怀疑任何事情都会比这更快或更短：
"#"+((1<<24)*Math.random()|0).toString(16)
挑战！
答案 2 :(得分：140)
以下是对此问题的另一种看法。
我的目标是创造充满活力和鲜明的色彩。为了确保颜色不同，我避免使用随机发生器并从彩虹中选择“均匀间隔”的颜色。
这非常适合在Google地图中创建具有最佳“唯一性”的弹出式标记（即，没有两个标记具有相似的颜色）。
function rainbow(numOfSteps, step) {
// This function generates vibrant, "evenly spaced" colours (i.e. no clustering). This is ideal for creating easily distinguishable vibrant markers in Google Maps and other apps.
// Adam Cole, 2011-Sept-14
// HSV to RBG adapted from: http://mjijackson.com/2008/02/rgb-to-hsl-and-rgb-to-hsv-color-model-conversion-algorithms-in-javascript
var r, g, b;
var h = step / numOfSteps;
var i = ~~(h * 6);
var f = h * 6 - i;
var q = 1 - f;
switch(i % 6){
case 0: r = 1; g = f; b = 0; break;
case 1: r = q; g = 1; b = 0; break;
case 2: r = 0; g = 1; b = f; break;
case 3: r = 0; g = q; b = 1; break;
case 4: r = f; g = 0; b = 1; break;
case 5: r = 1; g = 0; b = q; break;
}
var c = "#" + ("00" + (~ ~(r * 255)).toString(16)).slice(-2) + ("00" + (~ ~(g * 255)).toString(16)).slice(-2) + ("00" + (~ ~(b * 255)).toString(16)).slice(-2);
return (c);
}
如果您希望了解其实际效果，请参阅http://blog.adamcole.ca/2011/11/simple-javascript-rainbow-color.html。
答案 3 :(得分：45)
谁能击败它？
'#'+Math.random().toString(16).substr(-6);
保证始终有效：http://jsbin.com/OjELIfo/2/edit
基于@eterps注释，如果随机颜色的十六进制表示非常短（0.730224609375 =＆gt; 0.baf）
此代码应适用于所有情况：
function makeRandomColor(){
var c = '';
while (c.length < 7) {
c += (Math.random()).toString(16).substr(-6).substr(-1)
}
return '#'+c;
}
答案 4 :(得分：27)
不需要十六进制字母的哈希值。 JavaScript可以自己做到这一点：
function get_random_color() {
function c() {
var hex = Math.floor(Math.random()*256).toString(16);
return ("0"+String(hex)).substr(-2); // pad with zero
}
return "#"+c()+c()+c();
}
答案 5 :(得分：25)
使用亮度控制生成随机颜色：
function getRandColor(brightness){
// Six levels of brightness from 0 to 5, 0 being the darkest
var rgb = [Math.random() * 256, Math.random() * 256, Math.random() * 256];
var mix = [brightness*51, brightness*51, brightness*51]; //51 => 255/5
var mixedrgb = [rgb[0] + mix[0], rgb[1] + mix[1], rgb[2] + mix[2]].map(function(x){ return Math.round(x/2.0)})
return "rgb(" + mixedrgb.join(",") + ")";
}
答案 6 :(得分：25)
我喜欢这个：'#' + (Math.random().toString(16) + "000000").substring(2,8)
答案 7 :(得分：20)
您还可以在每个良好的浏览器（http://caniuse.com/#feat=css3-colors）
上使用HSLfunction randomHsl() {
return 'hsla(' + (Math.random() * 360) + ', 100%, 50%, 1)';
}
这只会给你明亮的颜色，你可以玩亮度，饱和度和alpha。
// es6
const randomHsl = () => `hsla(${Math.random() * 360}, 100%, 50%, 1)`
答案 8 :(得分：18)
'#'+Math.random().toString(16).slice(-3) // three-numbers format aka #f3c
'#'+Math.random().toString(16).slice(-6) // six-number format aka #abc123
答案 9 :(得分：17)
由Paul Irish撰写的关于JavaScript中随机十六进制颜色代码生成器的文章绝对令人惊叹。使用：
'#'+Math.floor(Math.random()*16777215).toString(16);
以下是源链接：
http://www.paulirish.com/2009/random-hex-color-code-snippets/
答案 10 :(得分：14)
这是@Anatoliy提供的解决方案的一个转折。
我只需要生成浅色（背景），所以我选择了三个字母（#AAA）格式：
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;
}
答案 11 :(得分：13)
使用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;
}
}
更新版本：
function random_color( format ){
var rint = Math.floor( 0x100000000 * Math.random());
switch( format ){
case 'hex':
return '#' + ('00000' + rint.toString(16)).slice(-6).toUpperCase();
case 'hexa':
return '#' + ('0000000' + rint.toString(16)).slice(-8).toUpperCase();
case 'rgb':
return 'rgb(' + (rint & 255) + ',' + (rint >> 8 & 255) + ',' + (rint >> 16 & 255) + ')';
case 'rgba':
return 'rgba(' + (rint & 255) + ',' + (rint >> 8 & 255) + ',' + (rint >> 16 & 255) + ',' + (rint >> 24 & 255)/255 + ')';
default:
return rint;
}
}
答案 12 :(得分：10)
如果你是像我这样的菜鸟，对十六进制等一无所知，这可能会更直观。
function r() { return Math.floor(Math.random() * 255) }
var color = 'rgb(' + r() + "," + r() + "," + r() + ')';
您只需要输入'rgb(255, 123, 220)'
答案 13 :(得分：10)
var color = "#";
for (k = 0; k < 3; k++) {
color += ("0" + (Math.random()*256|0).toString(16)).substr(-2);
}
细分如何运作：
Math.random()*256获得从0到256（0到255，包括0和255）的随机（浮点）数字
示例结果：116.15200161933899
在小数点后添加|0条
例如：116.15200161933899 - ＆gt; 116
使用.toString(16)将此数字转换为十六进制（基数为16）
例如：116 - ＆gt; 74个
另一个例子：228 - ＆gt; E4
添加"0"将其填充为零。当我们得到子字符串时这很重要，因为我们的最终结果必须为每种颜色都有两个字符
例如：74 - ＆gt; 074
另一个例子：8 - ＆gt; 08
.substr(-2)只获得最后两个字符
例如：074 - ＆gt; 74个
另一个例子：08 - ＆gt; 08（如果我们没有添加"0"，这将产生“8”而不是“08”）
for循环运行此循环三次，将每个结果添加到颜色字符串，产生如下内容：
#7408e4
答案 14 :(得分：9)
使用精确尺寸填充的简短答案
'#'+((1<<24)*(Math.random()+1)|0).toString(16).substr(1)
答案 15 :(得分：8)
所以虽然这里的所有答案都很好，但我想要对输出进行更多控制。例如，我想要防止任何近乎白色的阴影，同时确保我获得明亮鲜艳的色彩，而不是褪色。
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() +")";
};
所以现在我可以指定3个任意范围来从中选择rgb值。您可以在没有参数的情况下调用它并获取我的默认设置，这通常会产生一个非常鲜明的颜色，并且具有明显的主导色调，或者您可以提供自己的范围数组。
答案 16 :(得分：7)
`#${crypto.getRandomValues(new Uint32Array(1))[0].toString(16).padStart(8, 0).slice(-6)}`
`#${crypto.getRandomValues(new Uint32Array(1))[0].toString(16).padStart(8, 0)}`
答案 17 :(得分：6)
最佳答案的最高投票评论表明Martin Ankerl的方法优于随机十六进制数，虽然我没有改进Ankerl的方法，但我已成功将其翻译为JavaScript。我想我会对这个已经超大的SO线程发布一个额外的答案，因为最顶层的答案有另一个注释链接到一个Gist与Ankerl逻辑的JS实现，并且该链接被破坏（404）。如果我有声誉，我会简单地评论我创建的jsbin链接。
// adapted from
// http://jsfiddle.net/Mottie/xcqpF/1/light/
const rgb2hex = (rgb) => {
return (rgb && rgb.length === 3) ? "#" +
("0" + parseInt(rgb[0],10).toString(16)).slice(-2) +
("0" + parseInt(rgb[1],10).toString(16)).slice(-2) +
("0" + parseInt(rgb[2],10).toString(16)).slice(-2) : '';
}
// next two methods converted from Ruby to JS
// soured from http://martin.ankerl.com/2009/12/09/how-to-create-random-colors-programmatically/
// # HSV values in [0..1[
// # returns [r, g, b] values from 0 to 255
const hsv_to_rgb = (h, s, v) => {
const h_i = Math.floor(h*6)
const f = h*6 - h_i
const p = v * (1 - s)
const q = v * (1 - (f * s))
const t = v * (1 - (1 - f) * s)
let r, g, b
switch(h_i){
case(0):
[r, g, b] = [v, t, p]
break
case(1):
[r, g, b] = [q, v, p]
break
case(2):
[r, g, b] = [p, v, t]
break
case(3):
[r, g, b] = [p, q, v]
break
case(4):
[r, g, b] = [t, p, v]
break
case(5):
[r, g, b] = [v, p, q]
break
}
return [Math.floor(r * 256), Math.floor(g * 256), Math.floor(b * 256)]
}
// # use golden ratio
const golden_ratio_conjugate = 0.618033988749895
let h = Math.random() // # use random start value
const gen_hex = (numberOfColors) => {
const colorArray = []
while (numberOfColors > 0) {
h += golden_ratio_conjugate
h %= 1
colorArray.push(rgb2hex(hsv_to_rgb(h, 0.99, 0.99)))
numberOfColors -= 1
}
console.log(colorArray)
return colorArray
}
gen_hex(100)
答案 18 :(得分：6)
你可以使用这个简单的功能
function getRandomColor(){
var color = "#" + (Math.random() * 0xFFFFFF << 0).toString(16);
return color;
}
答案 19 :(得分：6)
Array.prototype.reduce让它变得非常干净。
["r","g","b"].reduce(function(res) {
return res + ("0"+~~(Math.random()*256).toString(16)).slice(-2)
}, "#")
需要旧浏览器的垫片。
答案 20 :(得分：6)
又一种随机颜色生成器：
var randomColor;
randomColor = Math.random() * 0x1000000; // 0 < randomColor < 0x1000000 (randomColor is a float)
randomColor = Math.floor(randomColor); // 0 < randomColor <= 0xFFFFFF (randomColor is an integer)
randomColor = randomColor.toString(16); // hex representation randomColor
randomColor = ("000000" + randomColor).slice(-6); // leading zeros added
randomColor = "#" + randomColor; // # added
答案 21 :(得分：5)
function get_random_color() {
return "#" + (Math.round(Math.random() * 0XFFFFFF)).toString(16);
}
答案 22 :(得分：5)
它会生成视觉不同颜色的调色板。
distinct-colors具有高度可配置性：
答案 23 :(得分：3)
以下是我的两个版本的随机十六进制代码生成器。
/* Slowest but shortest. */
"#000000".replace(/0/g,function(){return (~~(Math.random()*16)).toString(16);});
/* Good performance with small size. */
"#"+(function(a,b){while(a--){b+=""+(~~(Math.random()*16)).toString(16);} return b;})(6,"");
/* Remy Sharp provided one that's the fastest but a little bit too long */
(function(h){return '#000000'.substr(0,7-h.length)+h})((~~(Math.random()*(1<<24))).toString(16))
答案 24 :(得分：3)
此功能以两种方式超越其他答案：
尝试通过查找生成尽可能明显的颜色 20次尝试中的哪种颜色距离最远的欧几里德距离 HSV锥体中的其他人
它允许你限制色调， 饱和度或值范围，但仍尝试选择颜色 在该范围内尽可能明显。
它不是超级高效的，但是对于合理的价值（谁甚至可以轻易地分开100种颜色？）它足够快。
/**
* Generates a random palette of HSV colors. Attempts to pick colors
* that are as distinct as possible within the desired HSV range.
*
* @param {number} [options.numColors=10] - the number of colors to generate
* @param {number[]} [options.hRange=[0,1]] - the maximum range for generated hue
* @param {number[]} [options.sRange=[0,1]] - the maximum range for generated saturation
* @param {number[]} [options.vRange=[0,1]] - the maximum range for generated value
* @param {number[][]}[options.exclude=[[0,0,0],[0,0,1]]] - colors to exclude
*
* @returns {number[][]} an array of HSV colors (each HSV color
* is a [hue, saturation, value] array)
*/
function randomHSVPalette(options) {
function random(min, max) {
return min + Math.random() * (max - min);
}
function HSVtoXYZ(hsv) {
var h = hsv[0];
var s = hsv[1];
var v = hsv[2];
var angle = h * Math.PI * 2;
return [Math.sin(angle) * s * v,
Math.cos(angle) * s * v,
v];
}
function distSq(a, b) {
var dx = a[0] - b[0];
var dy = a[1] - b[1];
var dz = a[2] - b[2];
return dx * dx + dy * dy + dz * dz;
}
if (!options) {
options = {};
}
var numColors = options.numColors || 10;
var hRange = options.hRange || [0, 1];
var sRange = options.sRange || [0, 1];
var vRange = options.vRange || [0, 1];
var exclude = options.exclude || [[0, 0, 0], [0, 0, 1]];
var points = exclude.map(HSVtoXYZ);
var result = [];
while (result.length < numColors) {
var bestHSV;
var bestXYZ;
var bestDist = 0;
for (var i = 0; i < 20; i++) {
var hsv = [random(hRange[0], hRange[1]), random(sRange[0], sRange[1]), random(vRange[0], vRange[1])];
var xyz = HSVtoXYZ(hsv);
var minDist = 10;
points.forEach(function(point) {
minDist = Math.min(minDist, distSq(xyz, point));
});
if (minDist > bestDist) {
bestHSV = hsv;
bestXYZ = xyz;
bestDist = minDist;
}
}
points.push(bestXYZ);
result.push(bestHSV);
}
return result;
}
function HSVtoRGB(hsv) {
var h = hsv[0];
var s = hsv[1];
var v = hsv[2];
var i = ~~(h * 6);
var f = h * 6 - i;
var p = v * (1 - s);
var q = v * (1 - f * s);
var t = v * (1 - (1 - f) * s);
v = ~~(255 * v);
p = ~~(255 * p);
q = ~~(255 * q);
t = ~~(255 * t);
switch (i % 6) {
case 0: return [v, t, p];
case 1: return [q, v, p];
case 2: return [p, v, t];
case 3: return [p, q, v];
case 4: return [t, p, v];
case 5: return [v, p, q];
}
}
function RGBtoCSS(rgb) {
var r = rgb[0];
var g = rgb[1];
var b = rgb[2];
var rgb = (r << 16) + (g << 8) + b;
return '#' + ('000000' + rgb.toString(16)).slice(-6);
}
答案 25 :(得分：3)
对于随机的颜色代码，您应该使用'#'+Math.floor(Math.random()*16777215).toString(16);。
您的想法，但是为什么16777215呢？检查本文： Generate a random color with a single line of JavaScript code
function generateRandomColor()
{
var randomColor = '#'+Math.floor(Math.random()*16777215).toString(16);
if(randomColor.length != 7){ // In any case, the color code is invalid
randomColor = generateRandomColor();
}
return randomColor;
// The random color will be freshly served
}
document.body.style.backgroundColor = generateRandomColor() // -> #E1AC94
答案 26 :(得分：3)
几乎所有以前的简写方法都会生成无效的十六进制代码（五位数）。我遇到了一个类似的技术，只是没有这个问题here：
"#"+("000"+(Math.random()*(1<<24)|0).toString(16)).substr(-6)
在控制台中尝试：
for(i = 0; i < 200; i++) {
console.log("#" + ("000" + (Math.random()*(1<<24)|0).toString(16)).substr(-6));
}
答案 27 :(得分：2)
我的版本：
function RandomColor() {
var hex = (Math.round(Math.random()*0xffffff)).toString(16);
while (hex.length < 6) hex = "0" + hex;
return hex;
}
答案 28 :(得分：2)
您可以使用colorchain.js生成具有不同色调的一系列颜色。
答案 29 :(得分：2)
因为我可以，我创建了一个不可读的片段，在最小和最大十六进制代码之间随机化......：
function a(f, s){
if(!s || !s.length > 1) return "";
var c = Math.floor(Math.random()*(parseInt("0x" + s.substr(0,2))-parseInt("0x" + f.substr(0,2))+1)+parseInt("0x" + f.substr(0,2))).toString(16);
return (Array(3 - c.length).join("0")) + c + a(f.substr(2,f.length),s.substr(2,s.length));
}
a("990099","ff00ff")→可能会随机化→b5009e
它成对出现，因此a("12","f2")→可能随机化→8f。
但它不会高于'f2'。
var color = "#" + a("11","22") + a("33","44") + a("55","66");
与以下内容相同：
var color = "#" + a("113355","224466")
但速度较慢。
答案 30 :(得分：2)
此方法将获得一个随机数，将其转换为十六进制字符串，然后提取其中的一部分，为您提供随机数。
function randomColor() {
return "#" + Math.random().toString(16).slice(2,8);
}
答案 31 :(得分：2)
有很多方法可以实现这一目标。这是我做过的一些事情：
生成六个随机十六进制数字（0-F）
function randColor() {
for (var i=0, col=''; i<6; i++) {
col += (Math.random()*16|0).toString(16);
}
return '#'+col;
}
极短的单行
'#'+Math.random().toString(16).slice(-6)
生成单个RGB组件（00-FF）
function randColor2() {
var r = ('0'+(Math.random()*256|0).toString(16)).slice(-2),
g = ('0'+(Math.random()*256|0).toString(16)).slice(-2),
b = ('0'+(Math.random()*256|0).toString(16)).slice(-2);
return '#' +r+g+b;
}
过度设计的十六进制字符串（XOR 3输出一起形成颜色）
function randColor3() {
var str = Math.random().toString(16) + Math.random().toString(16),
sg = str.replace(/0./g,'').match(/.{1,6}/g),
col = parseInt(sg[0], 16) ^
parseInt(sg[1], 16) ^
parseInt(sg[2], 16);
return '#' + ("000000" + col.toString(16)).slice(-6);
}
答案 32 :(得分：1)
可能是最简单的
'#' + Math.random().toString(16).substring(9)
答案 33 :(得分：1)
许多答案不仅仅需要拨打Math.random()。或者他们希望那个数字的十六进制表示将有6个字符。
首先将随机浮点数乘以[0, 0xffffff + 1)范围。现在我们的数字的格式为0xRRRRRR，有些变化，这是一个有24位有效位的数字。一次读取4位，并使用该随机数[0, 15]并将其转换为lookup中匹配的十六进制字符。
function randomColor() {
var lookup = "0123456789abcdef";
var seed = Math.random() * 0x1000000;
return (
"#" +
lookup[(seed & 0xf00000) >> 20] +
lookup[(seed & 0x0f0000) >> 16] +
lookup[(seed & 0x00f000) >> 12] +
lookup[(seed & 0x000f00) >> 8] +
lookup[(seed & 0x0000f0) >> 4] +
lookup[seed & 0x00000f]
);
};
答案 34 :(得分：1)
你可以试试这个。这是一个绝对随机和舒适的颜色发生器））
var Color = '#';
var myElement;
for (var i = 0; i < 6; i++) {
function Random1(from, to) {
return Math.floor((Math.random() * (70 - 65 + 1)) + 65);
}
function Random2(from, to) {
return Math.floor((Math.random() * (1 - 0 + 1)) + 0);
}
function Random3(from, to) {
return Math.floor((Math.random() * (9 - 0 + 1)) + 0);
}
if (Random2()) {
myElement = Random3();
}
else {
myElement = String.fromCharCode(Random1());
}
Color += myElement;
}
答案 35 :(得分：1)
有点增强的单行，使方法更加生动
'#' + Math.round((0x1000000 + 0xffffff * Math.random())).toString(16).slice(1)
答案 36 :(得分：1)
使用此：
// RGBA()
function getRandomRGBA() {
function numbers() {
var x = Math.floor(Math.random() * 256);
return x;
}
alpha = 1.0;
return (
"rgba(" +
numbers() +
", " +
numbers() +
", " +
numbers() +
", " +
alpha.toFixed(1) +
")"
);
}
答案 37 :(得分：1)
regexp（始终返回有效的六进制十六进制颜色）
"#xxxxxx".replace(/x/g, y=>(Math.random()*16|0).toString(16))
let c= "#xxxxxx".replace(/x/g, y=>(Math.random()*16|0).toString(16));
console.log(c);
document.body.style.background=c
答案 38 :(得分：1)
function getRandomColor()
{
var color = "#";
for (var i = 0; i < 3; i++)
{
var part = Math.round(Math.random() * 255).toString(16);
color += (part.length > 1) ? part : "0" + part;
}
return color;
}
答案 39 :(得分：1)
此代码（Mohsen's）无法生成＃fcfc80等颜色。
'#'+Math.random().toString(16).substr(-6);
Nicolas Buduroi的人无法生成＃008a80。
'#' + (Math.random().toString(16) + "000000").substring(2,8)
此代码会生成大量非法颜色（例如#abcde）。
'#'+Math.floor(Math.random()*16777215).toString(16);
我一直在使用
"#"+((Math.random()+2)*16777216|0).toString(16).slice(1)
答案 40 :(得分：1)
我想创造非常独特和鲜艳的色彩（用于绘图）。对于任何严肃的事情，hsl 是比 rgb 更好的方法。如果需要，您可以按照其他人已经提到的方式将 hsl 转换为 rgb。
color_generator = () => hsl (360*Math.random(), 0.5 + Math.random()/2, 0.5)
它创造了一个非常漂亮的明亮鲜艳的色彩光谱，但问题是在通常的色谱中，红色、绿色、蓝色色调比黄色、青色和紫色更占主导地位。所以，我通过 acos 函数转换了色调。技术原因很无聊，所以我跳过它，但你可以在wiki中挖掘。
color_generator = () => {
let color_section = Math.floor(Math.random()/0.33) // there are three section in full spectrum
let transformed_hue = Math.acos(2*Math.random() - 1)/3.14 // transform so secondary colors would be as dominant as the primary colors
let hue = 120*color_section + 120*transformed_hue
return hsl(hue, 0.5 + Math.random()/2, 0.5)
}
结果是我尝试了许多其他方法后得到的最好的色谱。
参考文献：
答案 41 :(得分：1)
我认为第一个回答是最简洁/最有用的，但我刚写了一篇对初学者来说更容易理解的回答。
function randomHexColor(){
var hexColor=[]; //new Array()
hexColor[0] = "#"; //first value of array needs to be hash tag for hex color val, could also prepend this later
for (i = 1; i < 7; i++)
{
var x = Math.floor((Math.random()*16)); //Tricky: Hex has 16 numbers, but 0 is one of them
if (x >=10 && x <= 15) //hex:0123456789ABCDEF, this takes care of last 6
{
switch(x)
{
case 10: x="a"
break;
case 11: x="b"
break;
case 12: x="c"
break;
case 13: x="d"
break;
case 14: x="e"
break;
case 15: x="f"
break;
}
}
hexColor[i] = x;
}
var cString = hexColor.join(""); //this argument for join method ensures there will be no separation with a comma
return cString;
}
答案 42 :(得分：0)
这里的许多答案都基于Math.random().toString(16)。他们有时将随机数乘以某个数字，并假定转换为十六进制字符串将始终产生浮点十六进制表示形式，该浮点十六进制表示形式在点后至少具有六位数字（并且使用这些数字作为颜色）。
因为有很多数字实际上给出的位数少于六位数（点后）。如果Math.random()选择了这样的数字，则结果的十六进制颜色将无效（除非有人处理这种情况）。这是一个用于此类值的示例生成器（我基于this converter编写）。
function calc() {
let n = hex2dec(hexInput.value)
console.log(`${n} -> ${n.toString(16)}` );
}
// Source: https://stackoverflow.com/questions/5055723/converting-hexadecimal-to-float-in-javascript/5055821#5055821
function hex2dec(hex) {
hex = hex.split(/\./);
var len = hex[1].length;
hex[1] = parseInt(hex[1], 16);
hex[1] *= Math.pow(16, -len);
return parseInt(hex[0], 16) + hex[1];
}Put some 5-digit (or less) hexdecimal number in range 0-1<br>
<input id="hexInput" value="0.2D4EE">
<button onclick="calc()">Calc</button>
在没有此假设的情况下，我已经为您的问题提供了两个答案：RGB和hexadecimal，因此在此答案中，我不会提出其他解决方案。
答案 43 :(得分：0)
无需使用 JavaScript 即可生成随机的 CSS 颜色。
例如，在 SCSS/Sass 中，您可以使用以下内容：
.rgb-color-selector {
background-color: rgb(random(255), random(255), random(255));
}
或
.hsl-color-selector {
color: hsl(random(360) * 1deg, floor(random() * 100%), floor(random() * 100%));;
}
答案 44 :(得分：0)
function generateRandomColor()
{
var randomColor = '#'+Math.floor(Math.random()*16777215).toString(16);
return randomColor;
//random color will be freshly served
}
document.body.style.backgroundColor = generateRandomColor() // -> #e1ac94
someDiv.style.color = generateRandomColor() // -> #34c7aa
答案 45 :(得分：0)
function randomColor(){
var num = Math.round(Math.random() * Math.pow(10,7));
// converting number to hex string to be read as RGB
var hexString = '#'+num.toString(16);
return hexString;
}
答案 46 :(得分：0)
地图（返回始终有效的rgb颜色）
`rgb(${[1,2,3].map(x=>Math.random()*256|0)})`
let c= `rgb(${[1,2,3].map(x=>Math.random()*256|0)})`
console.log(c);
document.body.style.background=c
答案 47 :(得分：0)
使用ES6的Array.from（）方法，创建了以下解决方案：
function randomColor() {
return "#"+ Array.from({length: 6},()=> Math.floor(Math.random()*16).toString(16)).join("");
}
我见过的其他实现需要确保如果十六进制值的前导零，数字仍然包含6位数字。
K._的答案为此使用了ES6的padStart
function randomColor() {
return `#${Math.floor(Math.random() * 0x1000000).toString(16).padStart(6, 0)}`
}
我见过的另一个好的单行解决方案是
function randomColor() {
return '#'+ ('000000' + (Math.random()*0xFFFFFF<<0).toString(16)).slice(-6);
}
答案 48 :(得分：0)
具有递归
var randomColor = (s='') => s.length === 6 ? '#' + s : randomColor(s + '0123456789ABCDEF'[Math.floor(Math.random() * 16)]);
randomColor();
答案 49 :(得分：0)
工作单线解决方案（填充前导零）：
var color="#"+"colors".split("").map(function(){return parseInt(Math.random()*0x10).toString(16);}).join("");
答案 50 :(得分：0)
function getHashColor() {
var hash = "0123456789ABCDEF";
var hashColor = "#";
for (var i = 0; i < 6; i++)
hashColor += hash[Math.floor(Math.random() * hash.length)];
document.getElementById('demo').style.background = hashColor
}<div id="demo" style="background:red;height:300px;width:300px"></div>
<button type="button" onclick="getHashColor()">Clik Me</button>
答案 51 :(得分：0)
我喜欢这种情况下的parseInt：
parseInt(Math.random()*0xFFFFFFFF).toString(16)
答案 52 :(得分：0)
试用此套餐 - https://www.npmjs.com/package/gen-random-colors 它还提供了将颜色集配置为0到5（0是最暗的）
的功能答案 53 :(得分：0)
{{1}}
答案 54 :(得分：0)
我已生成100种不同颜色的不同对比度，您可以根据需要增加值：
Feedle例如：
http://jsfiddle.net/zFbfE/29/
它适用于我，我认为它对你也有帮助
这个例子中最好的一点是，它会产生100种随机颜色，并且每次加载页面颜色都相同。
答案 55 :(得分：0)
此行应随机更改颜色：
setInterval(function(){y.style.color=''+"rgb(1"+Math.floor(Math.random() * 100)+",1"+Math.floor(Math.random() * 100)+",1"+Math.floor(Math.random() * 100)+")"+'';},1000);
答案 56 :(得分：0)
var html = '';
var red;
var green;
var blue;
var rgbColor;
for ( var i = 1; i <= 100; i += 1) {
red = Math.floor(Math.random() * 256 );
green = Math.floor(Math.random() * 256 );
blue = Math.floor(Math.random() * 256 );
rgbColor = 'rgb(' + red + ',' + green + ',' + blue + ')';
html += '<div style="background-color:' + rgbColor + '"></div>';
}
document.write(html);