javascript - 过滤十六进制颜色

Question

我有大量不同的十六进制颜色（> 6500），我想删除非常暗的颜色和非常亮的颜色。

我怎样才能做到这一点？明亮和黑暗的十六进制颜色代码中是否有特定的特征可以用来过滤掉它们？我是否需要将它们转换为整数..？

谢谢！

Answer 1

这是一种快速而肮脏的方法，可能会：

将您的十六进制颜色分成 R/G/B 字节。

将十六进制字节转换为十进制，将它们加在一起并除以 3 以获得平均“亮度”的粗略概念。

选择您希望颜色在 0 到 255 的最大可能范围内的亮度上限和下限，并排除这两个限制之外的任何颜色。

例如

#FFBBAA => FF BB AA => ( 255 + 187 + 170 ) / 3 = 204。

如果你决定 200 是你的“亮度”上限，那么这个颜色就太亮了。您设置的限制完全是主观的，所以取决于您。

如果您对直接使用 Hex 进行计算感到满意，则可以完全跳过转换为十进制并保留所有 Hex 计算。

Answer 2

此函数使用正则表达式解析字符串值并返回从 0（黑色）到 1（100% 白色）的亮度。

function hexBrightness(hex) {
    var regExp = hex.length < 6 ? /^#(([a-f\d]))(([a-f\d]))(([a-f\d]))$/i : /^#([a-f\d])([a-f\d])([a-f\d])([a-f\d])([a-f\d])([a-f\d])$/i;

    var result = regExp.exec(hex);
    if (result) {
        var r = parseInt("" + result[1] + result[2], 16),
            g = parseInt("" + result[3] + result[4], 16),
            b = parseInt("" + result[5] + result[6], 16),
            max = Math.max(r, g, b),
            min = Math.min(r, g, b),
            l = (max + min) / 2;
        return l / 255;
    }
    return null;
}

// Test
var assert = function (assertion, name) {
    $("<p/>").appendTo(document.body).text(name + (assertion ? ' works' : ' fails'))
}
assert(hexBrightness('#FFFFFF') == 1, 'Uppercase');
assert(hexBrightness('#ffffff') == 1, 'Lowercase');
assert(hexBrightness('#fff') == 1, 'Short');
assert(hexBrightness('#000') == 0, 'Black');
assert(hexBrightness('invalid') == null, 'Invalid color');

工作小提琴：http: //jsfiddle.net/L7PqT/