给定这个函数，我想用随机颜色生成器替换颜色。
document.overlay = GPolyline.fromEncoded({
color: "#0000FF",
weight: 10,
points: encoded_points,
zoomFactor: 32,
levels: encoded_levels,
numLevels: 4
});
我该怎么做呢?
当前回答
没有必要使用JavaScript来生成一个随机的CSS颜色。
例如，在SCSS/Sass中，你可以使用这样的东西:
.rgb-color-selector {
background-color: rgb(random(255), random(255), random(255));
}
or
.hsl-color-selector {
color: hsl(random(360) * 1deg, floor(random() * 100%), floor(random() * 100%));;
}
CodePen样本。
其他回答
下面是@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;
}
使用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>
我的版本:
function RandomColor() {
var hex = (Math.round(Math.random()*0xffffff)).toString(16);
while (hex.length < 6) hex = "0" + hex;
return hex;
}
Array.prototype.reduce使它非常简洁。
["r", "g", "b"].reduce(function(res) {
return res + ("0" + ~~(Math.random()*256).toString(16)).slice(-2)
}, "#")
它需要一个旧浏览器的垫片。
您还可以使用在所有优秀浏览器(http://caniuse.com/#feat=css3-colors)上可用的HSL。
function randomHsl() {
return 'hsla(' + (Math.random() * 360) + ', 100%, 50%, 1)';
}
这将给你只有明亮的颜色，你可以玩亮度，饱和度和阿尔法。
// es6
const randomHsl = () => `hsla(${Math.random() * 360}, 100%, 50%, 1)`
