鉴于此功能,我想更换颜色与颜色随机发生器。
document.overlay = GPolyline.fromEncoded({
color: "#0000FF",
weight: 10,
points: encoded_points,
zoomFactor: 32,
levels: encoded_levels,
numLevels: 4
});
我该怎么做?
鉴于此功能,我想更换颜色与颜色随机发生器。
document.overlay = GPolyline.fromEncoded({
color: "#0000FF",
weight: 10,
points: encoded_points,
zoomFactor: 32,
levels: encoded_levels,
numLevels: 4
});
我该怎么做?
使用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<<24)*Math.random() | 0).toString(16)
挑战!
这是对这个问题的另一种看法。
我的目标是创造充满活力和独特的色彩。为了确保颜色不同,我避免使用随机生成器并从彩虹中选择“均匀间隔”的颜色。
这非常适合在 Google 地图中创建具有最佳“唯一性”(即,没有两个标记具有相似颜色)的弹出标记。
/**
* @param numOfSteps: Total number steps to get color, means total colors
* @param step: The step number, means the order of the color
*/
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);
}
如果您想查看实际效果,请参阅用于 Google 地图标记的简单 JavaScript 彩虹颜色生成器。
谁能打败它?
'#' + Math.random().toString(16).substr(-6);
保证一直有效:http : //jsbin.com/OjELIfo/2/edit
根据eterps 的评论,如果随机颜色的十六进制表示非常短(0.730224609375
=> 0.baf
),上面的代码仍然可以生成更短的字符串。
此代码应适用于所有情况:
function makeRandomColor(){
var c = '';
while (c.length < 7) {
c += (Math.random()).toString(16).substr(-6).substr(-1)
}
return '#' + c;
}
您还可以在每个好的浏览器上使用 HSL ( http://caniuse.com/#feat=css3-colors )
function randomHsl() {
return 'hsla(' + (Math.random() * 360) + ', 100%, 50%, 1)';
}
这只会给你明亮的颜色,你可以调整亮度、饱和度和 alpha。
// es6
const randomHsl = () => `hsla(${Math.random() * 360}, 100%, 50%, 1)`