如何比较两种颜色的相似度/差异


171

我想设计一个程序,可以帮助我评估5种预定义颜色之间的哪种颜色更类似于可变颜色,以及以什么百分比进行评估。问题是我不知道如何一步一步地手动进行操作。因此,想一个程序就更加困难了。

更多详细信息:颜色来自带有不同颜色的凝胶管的照片。我有5个颜色不同的试管,每个试管代表5个级别中的1个。我想拍摄其他样本的照片,然后在计算机上通过比较颜色来评估该样本属于哪个级别,我也想知道它的近似百分比。我想要一个执行以下操作的程序:http : //www.colortools.net/color_matcher.html

如果您可以告诉我要采取什么步骤,即使这些是我自己要手动思考和执行的事情。这将非常有帮助。


1
我对文本进行了较小的更改,将葡萄牙语单词更改为我认为是正确的英语等效单词...如果我犯了错误,请将其改回。
Beska 2012年

13
有一篇有关颜色差异的维基百科文章:en.wikipedia.org/wiki/Color_difference
Ocaso Protal

4
这应该很有趣:stevehanov.ca/blog/index.php?id=116它探索计算三种不同颜色模型中的差异。
弗拉德(Vlad)2012年

嘿@OcasoProtal,感谢您的分享,这是一个很好的链接。对于OP,有趣的问题。
感知2012年

尽量减少任何潜在的照片变异性...更多详细信息,请参见下面的答案。
Beska 2012年

Answers:


130

有关正确的线索,请参见Wikipedia上有关色差的文章。基本上,您想在某些多维色彩空间中计算距离度量。但是RGB并不是“感知上统一的”,因此Vadim建议的欧几里得RGB距离度量将与人类感知的颜色之间的距离不匹配。首先,L a b *应该是感知上均匀的色彩空间,并且通常使用deltaE度量。但是,还有更多精致的色彩空间和更多精致的deltaE公式更接近于匹配人类的感知。

您必须了解有关色彩空间和光源的更多信息才能进行转换。但是要获得比欧几里得RGB指标更好的快速公式,只需执行以下操作:假设您的RGB值在sRGB色彩空间中,找到sRGB到L a b *的转换公式,将sRGB颜色转换为L a b *,并计算两个L a b *值之间的deltaE 。它在计算上并不昂贵,它只是一些非线性公式以及一些乘加运算。


11
+1是“ deltaE”,这是最标准化的比较方法,并且deltaE公式适用于不同的用例。
马丁·亨宁斯

9
您可以在此处找到转换公式:brucelindbloom.com/index.html?Equations.html
GuillermoGutiérrez

4
或者,如果您使用的是Ruby,请查看实现deltaE以及其他颜色操作的colorgem
Mike Jarema 2015年


46

只是我首先想到的一个想法(对不起,如果很愚蠢)。颜色的三个组成部分可以假定为点的3D坐标,然后可以计算点之间的距离。

有限元

Point1 has R1 G1 B1
Point2 has R2 G2 B2

颜色之间的距离为

d=sqrt((r2-r1)^2+(g2-g1)^2+(b2-b1)^2)

百分比为

p=d/sqrt((255)^2+(255)^2+(255)^2)

28
如果我们使用的是RGB色彩空间,则两种颜色之间的差异与人类对差异的感知并不相同。但是是的,基本思想在任何地方都是相同的-我们只需要将其映射到另一个颜色空间(我认为是实验室)
Voo 2012年

6
@Voo:我同意,对于基于距离的相似度匹配,HSV / HSL / LAB比(s)RGB的色彩空间要好得多。
乔恩·普迪

4
这是告诉您两种颜色的区别的好方法,但是告诉您两种颜色的区别是不好的。人眼远非完美:我们对绿色比红色或蓝色更敏感,我们对亮度的感知是对数的,等等。但请参见此处,了解专门为人类视觉量身定制的算法。
BlueRaja-Danny Pflughoeft 2012年

+这也是我的第一个想法。
ST3

9
这里的另一问题是255,0,0是从0相同的距离,255,0,因为它是0,0,255

27

实际上,几个月前我走了同样的路。这个问题没有完美的答案(在这里被问过几次),但是有一个比sqrt(rr)等答案更复杂的问题,并且更容易直接使用RGB,而无需移至所有其他颜色空间。我在这里找到了这个公式它是相当复杂的真实公式的低成本近似值 (通过CIE(即颜色的W3C),因为这不是一项尚未完成的任务,因此您可以在其中找到更旧,更简单的色差方程式。祝好运

编辑:为了后代,这是相关的C代码:

typedef struct {
     unsigned char r, g, b;
} RGB;

double ColourDistance(RGB e1, RGB e2)
{
    long rmean = ( (long)e1.r + (long)e2.r ) / 2;
    long r = (long)e1.r - (long)e2.r;
    long g = (long)e1.g - (long)e2.g;
    long b = (long)e1.b - (long)e2.b;
    return sqrt((((512+rmean)*r*r)>>8) + 4*g*g + (((767-rmean)*b*b)>>8));
}

这种方法对我有用。它帮助我从颜色名称列表中找到最接近的颜色。
faisalbhagat

23

颜色值具有多个维度,因此没有内在的方法可以比较两种颜色。您必须为用例确定颜色的含义,从而确定如何最好地比较它们。

您最有可能希望比较与红色/绿色/蓝色分量相对的颜色的色相,饱和度和/或亮度属性。如果您在弄清楚如何进行比较时遇到困难,请获取一些成对的样本颜色并进行心理比较,然后尝试向自己说明/解释为什么它们相似/不同。

一旦知道要比较的颜色的属性/成分,就需要弄清楚如何从颜色中提取信息。

您很可能只需要将颜色从常见的RedGreenBlue表示形式转换为HueSaturationLightness,然后计算类似

avghue = (color1.hue + color2.hue)/2
distance = abs(color1.hue-avghue)

本示例将为您提供一个简单的标量值,该值指示颜色的渐变/色相彼此之间的距离。

请参阅Wikipedia上的HSL和HSV


2
从我记得在讲这些东西的内容中,我会将图像转换为Lab色彩空间,而不是HSV / HSL。选那个有什么理由吗?
Voo 2012年

不。RGB和HSL是我最熟悉的,所以我选择HSL只是为了强调“默认” RGB不是唯一的选择的想法-它实际上取决于应用程序。感谢您通知我有关Lab色彩空间的信息。
2012年

1
无论如何,我给了+1,因为这里的基本原理是“正确”的答案(在色彩空间中进行转换以统一处理感知到的差异,然后进行比较)。我不确定哪个空间是最好的-所有这些不同的颜色空间都会让我感到困惑;)
Voo 2012年

21

如果您有两个Color对象c1c2,则可以将的每个RGB值c1与进行比较c2

int diffRed   = Math.abs(c1.getRed()   - c2.getRed());
int diffGreen = Math.abs(c1.getGreen() - c2.getGreen());
int diffBlue  = Math.abs(c1.getBlue()  - c2.getBlue());

您可以将这些值除以差异饱和度的数量(255),然后得到两者之间的差异。

float pctDiffRed   = (float)diffRed   / 255;
float pctDiffGreen = (float)diffGreen / 255;
float pctDiffBlue   = (float)diffBlue  / 255;

之后,您可以找到百分比的平均色差。

(pctDiffRed + pctDiffGreen + pctDiffBlue) / 3 * 100

这会使您c1和之间的百分比有所不同c2


另外2个小事情:<b> 1 </ b> pctDiffRed = diffRed / 255;将给您0,除非您在某个地方使用浮点数。<b> 2 </ b>您需要在某处乘以100才能得到百分比。
vaughandroid 2012年

18
这可能不会产生最佳的“可见”差异,因为人眼对颜色的感知不同。话虽如此,我猜这正是她在寻找的东西,因为她可能正在寻找同等可量化的差异,而不是预期的差异。只是以为我会在这里将其作为相关考虑的考虑因素。
Beska 2012年

14

通过人类感知比较两种颜色的最佳方法之一是CIE76。差异称为Delta-E。小于1时,人眼无法识别差异。

有很棒的颜色实用程序类ColorUtils(下面的代码),其中包括CIE76比较方法。它由苏黎世大学的Daniel Strebel撰写。

在ColorUtils.class中,我使用以下方法:

static double colorDifference(int r1, int g1, int b1, int r2, int g2, int b2)

r1,g1,b1-第一种颜色的RGB值

r2,g2,b2-RGB值是您要比较的第二种颜色

如果您使用的是Android,则可以按以下方式获取这些值:

r1 = Color.red(pixel);

g1 = Color.green(pixel);

b1 = Color.blue(pixel);


苏黎世大学Daniel Strebel撰写的ColorUtils.class:

import android.graphics.Color;

public class ColorUtil {
public static int argb(int R, int G, int B) {
    return argb(Byte.MAX_VALUE, R, G, B);
}

public static int argb(int A, int R, int G, int B) {
    byte[] colorByteArr = {(byte) A, (byte) R, (byte) G, (byte) B};
    return byteArrToInt(colorByteArr);
}

public static int[] rgb(int argb) {
    return new int[]{(argb >> 16) & 0xFF, (argb >> 8) & 0xFF, argb & 0xFF};
}

public static int byteArrToInt(byte[] colorByteArr) {
    return (colorByteArr[0] << 24) + ((colorByteArr[1] & 0xFF) << 16)
            + ((colorByteArr[2] & 0xFF) << 8) + (colorByteArr[3] & 0xFF);
}

public static int[] rgb2lab(int R, int G, int B) {
    //http://www.brucelindbloom.com

    float r, g, b, X, Y, Z, fx, fy, fz, xr, yr, zr;
    float Ls, as, bs;
    float eps = 216.f / 24389.f;
    float k = 24389.f / 27.f;

    float Xr = 0.964221f;  // reference white D50
    float Yr = 1.0f;
    float Zr = 0.825211f;

    // RGB to XYZ
    r = R / 255.f; //R 0..1
    g = G / 255.f; //G 0..1
    b = B / 255.f; //B 0..1

    // assuming sRGB (D65)
    if (r <= 0.04045)
        r = r / 12;
    else
        r = (float) Math.pow((r + 0.055) / 1.055, 2.4);

    if (g <= 0.04045)
        g = g / 12;
    else
        g = (float) Math.pow((g + 0.055) / 1.055, 2.4);

    if (b <= 0.04045)
        b = b / 12;
    else
        b = (float) Math.pow((b + 0.055) / 1.055, 2.4);


    X = 0.436052025f * r + 0.385081593f * g + 0.143087414f * b;
    Y = 0.222491598f * r + 0.71688606f * g + 0.060621486f * b;
    Z = 0.013929122f * r + 0.097097002f * g + 0.71418547f * b;

    // XYZ to Lab
    xr = X / Xr;
    yr = Y / Yr;
    zr = Z / Zr;

    if (xr > eps)
        fx = (float) Math.pow(xr, 1 / 3.);
    else
        fx = (float) ((k * xr + 16.) / 116.);

    if (yr > eps)
        fy = (float) Math.pow(yr, 1 / 3.);
    else
        fy = (float) ((k * yr + 16.) / 116.);

    if (zr > eps)
        fz = (float) Math.pow(zr, 1 / 3.);
    else
        fz = (float) ((k * zr + 16.) / 116);

    Ls = (116 * fy) - 16;
    as = 500 * (fx - fy);
    bs = 200 * (fy - fz);

    int[] lab = new int[3];
    lab[0] = (int) (2.55 * Ls + .5);
    lab[1] = (int) (as + .5);
    lab[2] = (int) (bs + .5);
    return lab;
}

/**
 * Computes the difference between two RGB colors by converting them to the L*a*b scale and
 * comparing them using the CIE76 algorithm { http://en.wikipedia.org/wiki/Color_difference#CIE76}
 */
public static double getColorDifference(int a, int b) {
    int r1, g1, b1, r2, g2, b2;
    r1 = Color.red(a);
    g1 = Color.green(a);
    b1 = Color.blue(a);
    r2 = Color.red(b);
    g2 = Color.green(b);
    b2 = Color.blue(b);
    int[] lab1 = rgb2lab(r1, g1, b1);
    int[] lab2 = rgb2lab(r2, g2, b2);
    return Math.sqrt(Math.pow(lab2[0] - lab1[0], 2) + Math.pow(lab2[1] - lab1[1], 2) + Math.pow(lab2[2] - lab1[2], 2));
}
}

上面的代码在rgb2lab中出错:在r,g和b转换中,以12除以12.92除。否则功能不是在r =连续0.04045
约翰·史密斯

10

只是另一个答案,尽管它与Supr的答案相似-只是一个不同的色彩空间。

问题是:人类无法均匀地感知颜色差异,而RGB色彩空间却忽略了这一点。结果,如果您使用RGB颜色空间并仅计算两种颜色之间的欧几里得距离,则可能会获得一个在数学上绝对正确的差异,但与人类会告诉您的不一致。

这可能不成问题-我认为两者之间的差别并不大,但是如果您想解决这个“更好”的问题,则应将RGB颜色转换为专门为避免上述问题而设计的颜色空间。有几项是对早期模型的改进(由于这是基于人类的感知,因此我们需要根据实验数据来测量“正确”值)。还有的Lab色彩空间,我觉得这是最好的,虽然有点复杂,将其转换为。CIE XYZ比较简单。

这是一个列出公式以在不同颜色空间之间转换的站点,因此您可以尝试一下。


3

以下所有方法的结果范围为0-100。

internal static class ColorDifference
{
    internal enum Method
    {
        Binary, // true or false, 0 is false
        Square,
        Dimensional,
        CIE76
    }

    public static double Calculate(Method method, int argb1, int argb2)
    {
        int[] c1 = ColorConversion.ArgbToArray(argb1);
        int[] c2 = ColorConversion.ArgbToArray(argb2);
        return Calculate(method, c1[1], c2[1], c1[2], c2[2], c1[3], c2[3], c1[0], c2[0]);
    }

    public static double Calculate(Method method, int r1, int r2, int g1, int g2, int b1, int b2, int a1 = -1, int a2 = -1)
    {
        switch (method)
        {
            case Method.Binary:
                return (r1 == r2 && g1 == g2 && b1 == b2 && a1 == a2) ? 0 : 100;
            case Method.CIE76:
                return CalculateCIE76(r1, r2, g1, g2, b1, b2);
            case Method.Dimensional:
                if (a1 == -1 || a2 == -1) return Calculate3D(r1, r2, g1, g2, b1, b2);
                else return Calculate4D(r1, r2, g1, g2, b1, b2, a1, a2);
            case Method.Square:
                return CalculateSquare(r1, r2, g1, g2, b1, b2, a1, a2);
            default:
                throw new InvalidOperationException();
        }
    }

    public static double Calculate(Method method, Color c1, Color c2, bool alpha)
    {
        switch (method)
        {
            case Method.Binary:
                return (c1.R == c2.R && c1.G == c2.G && c1.B == c2.B && (!alpha || c1.A == c2.A)) ? 0 : 100;
            case Method.CIE76:
                if (alpha) throw new InvalidOperationException();
                return CalculateCIE76(c1, c2);
            case Method.Dimensional:
                if (alpha) return Calculate4D(c1, c2);
                else return Calculate3D(c1, c2);
            case Method.Square:
                if (alpha) return CalculateSquareAlpha(c1, c2);
                else return CalculateSquare(c1, c2);
            default:
                throw new InvalidOperationException();
        }
    }

    // A simple idea, based on on a Square
    public static double CalculateSquare(int argb1, int argb2)
    {
        int[] c1 = ColorConversion.ArgbToArray(argb1);
        int[] c2 = ColorConversion.ArgbToArray(argb2);
        return CalculateSquare(c1[1], c2[1], c1[2], c2[2], c1[3], c2[3]);
    }

    public static double CalculateSquare(Color c1, Color c2)
    {
        return CalculateSquare(c1.R, c2.R, c1.G, c2.G, c1.B, c2.B);
    }

    public static double CalculateSquareAlpha(int argb1, int argb2)
    {
        int[] c1 = ColorConversion.ArgbToArray(argb1);
        int[] c2 = ColorConversion.ArgbToArray(argb2);
        return CalculateSquare(c1[1], c2[1], c1[2], c2[2], c1[3], c2[3], c1[0], c2[0]);
    }

    public static double CalculateSquareAlpha(Color c1, Color c2)
    {
        return CalculateSquare(c1.R, c2.R, c1.G, c2.G, c1.B, c2.B, c1.A, c2.A);
    }

    public static double CalculateSquare(int r1, int r2, int g1, int g2, int b1, int b2, int a1 = -1, int a2 = -1)
    {
        if (a1 == -1 || a2 == -1) return (Math.Abs(r1 - r2) + Math.Abs(g1 - g2) + Math.Abs(b1 - b2)) / 7.65;
        else return (Math.Abs(r1 - r2) + Math.Abs(g1 - g2) + Math.Abs(b1 - b2) + Math.Abs(a1 - a2)) / 10.2;
    }

    // from:http://stackoverflow.com/questions/9018016/how-to-compare-two-colors
    public static double Calculate3D(int argb1, int argb2)
    {
        int[] c1 = ColorConversion.ArgbToArray(argb1);
        int[] c2 = ColorConversion.ArgbToArray(argb2);
        return Calculate3D(c1[1], c2[1], c1[2], c2[2], c1[3], c2[3]);
    }

    public static double Calculate3D(Color c1, Color c2)
    {
        return Calculate3D(c1.R, c2.R, c1.G, c2.G, c1.B, c2.B);
    }

    public static double Calculate3D(int r1, int r2, int g1, int g2, int b1, int b2)
    {
        return Math.Sqrt(Math.Pow(Math.Abs(r1 - r2), 2) + Math.Pow(Math.Abs(g1 - g2), 2) + Math.Pow(Math.Abs(b1 - b2), 2)) / 4.41672955930063709849498817084;
    }

    // Same as above, but made 4D to include alpha channel
    public static double Calculate4D(int argb1, int argb2)
    {
        int[] c1 = ColorConversion.ArgbToArray(argb1);
        int[] c2 = ColorConversion.ArgbToArray(argb2);
        return Calculate4D(c1[1], c2[1], c1[2], c2[2], c1[3], c2[3], c1[0], c2[0]);
    }

    public static double Calculate4D(Color c1, Color c2)
    {
        return Calculate4D(c1.R, c2.R, c1.G, c2.G, c1.B, c2.B, c1.A, c2.A);
    }

    public static double Calculate4D(int r1, int r2, int g1, int g2, int b1, int b2, int a1, int a2)
    {
        return Math.Sqrt(Math.Pow(Math.Abs(r1 - r2), 2) + Math.Pow(Math.Abs(g1 - g2), 2) + Math.Pow(Math.Abs(b1 - b2), 2) + Math.Pow(Math.Abs(a1 - a2), 2)) / 5.1;
    }

    /**
    * Computes the difference between two RGB colors by converting them to the L*a*b scale and
    * comparing them using the CIE76 algorithm { http://en.wikipedia.org/wiki/Color_difference#CIE76}
    */
    public static double CalculateCIE76(int argb1, int argb2)
    {
        return CalculateCIE76(Color.FromArgb(argb1), Color.FromArgb(argb2));
    }

    public static double CalculateCIE76(Color c1, Color c2)
    {
        return CalculateCIE76(c1.R, c2.R, c1.G, c2.G, c1.B, c2.B);
    }

    public static double CalculateCIE76(int r1, int r2, int g1, int g2, int b1, int b2)
    {
        int[] lab1 = ColorConversion.ColorToLab(r1, g1, b1);
        int[] lab2 = ColorConversion.ColorToLab(r2, g2, b2);
        return Math.Sqrt(Math.Pow(lab2[0] - lab1[0], 2) + Math.Pow(lab2[1] - lab1[1], 2) + Math.Pow(lab2[2] - lab1[2], 2)) / 2.55;
    }
}


internal static class ColorConversion
{

    public static int[] ArgbToArray(int argb)
    {
        return new int[] { (argb >> 24), (argb >> 16) & 0xFF, (argb >> 8) & 0xFF, argb & 0xFF };
    }

    public static int[] ColorToLab(int R, int G, int B)
    {
        // http://www.brucelindbloom.com

        double r, g, b, X, Y, Z, fx, fy, fz, xr, yr, zr;
        double Ls, fas, fbs;
        double eps = 216.0f / 24389.0f;
        double k = 24389.0f / 27.0f;

        double Xr = 0.964221f;  // reference white D50
        double Yr = 1.0f;
        double Zr = 0.825211f;

        // RGB to XYZ
        r = R / 255.0f; //R 0..1
        g = G / 255.0f; //G 0..1
        b = B / 255.0f; //B 0..1

        // assuming sRGB (D65)
        if (r <= 0.04045) r = r / 12;
        else r = (float)Math.Pow((r + 0.055) / 1.055, 2.4);

        if (g <= 0.04045) g = g / 12;
        else g = (float)Math.Pow((g + 0.055) / 1.055, 2.4);

        if (b <= 0.04045) b = b / 12;
        else b = (float)Math.Pow((b + 0.055) / 1.055, 2.4);

        X = 0.436052025f * r + 0.385081593f * g + 0.143087414f * b;
        Y = 0.222491598f * r + 0.71688606f * g + 0.060621486f * b;
        Z = 0.013929122f * r + 0.097097002f * g + 0.71418547f * b;

        // XYZ to Lab
        xr = X / Xr;
        yr = Y / Yr;
        zr = Z / Zr;

        if (xr > eps) fx = (float)Math.Pow(xr, 1 / 3.0);
        else fx = (float)((k * xr + 16.0) / 116.0);

        if (yr > eps) fy = (float)Math.Pow(yr, 1 / 3.0);
        else fy = (float)((k * yr + 16.0) / 116.0);

        if (zr > eps) fz = (float)Math.Pow(zr, 1 / 3.0);
        else fz = (float)((k * zr + 16.0) / 116);

        Ls = (116 * fy) - 16;
        fas = 500 * (fx - fy);
        fbs = 200 * (fy - fz);

        int[] lab = new int[3];
        lab[0] = (int)(2.55 * Ls + 0.5);
        lab[1] = (int)(fas + 0.5);
        lab[2] = (int)(fbs + 0.5);
        return lab;
    }
}

2

最好的方法是deltaE。DeltaE是显示颜色差异的数字。如果deltae <1,则人眼无法识别出差异。我在canvas和js中编写了一个代码,用于将rgb转换为lab,然后计算delta e。在此示例中,代码正在识别具有与我另存为LAB1的基色不同的颜色的像素。然后如果不同,则将这些像素设为红色。您可以随增量增加或减少色差的灵敏度,或减小可接受的色差范围。在此示例中,我在编写的行中为deltaE分配了10(deltae <= 10):

<script>   
  var constants = {
    canvasWidth: 700, // In pixels.
    canvasHeight: 600, // In pixels.
    colorMap: new Array() 
          };



  // -----------------------------------------------------------------------------------------------------

  function fillcolormap(imageObj1) {


    function rgbtoxyz(red1,green1,blue1){ // a converter for converting rgb model to xyz model
 var red2 = red1/255;
 var green2 = green1/255;
 var blue2 = blue1/255;
 if(red2>0.04045){
      red2 = (red2+0.055)/1.055;
      red2 = Math.pow(red2,2.4);
 }
 else{
      red2 = red2/12.92;
 }
 if(green2>0.04045){
      green2 = (green2+0.055)/1.055;
      green2 = Math.pow(green2,2.4);    
 }
 else{
      green2 = green2/12.92;
 }
 if(blue2>0.04045){
      blue2 = (blue2+0.055)/1.055;
      blue2 = Math.pow(blue2,2.4);    
 }
 else{
      blue2 = blue2/12.92;
 }
 red2 = (red2*100);
 green2 = (green2*100);
 blue2 = (blue2*100);
 var x = (red2 * 0.4124) + (green2 * 0.3576) + (blue2 * 0.1805);
 var y = (red2 * 0.2126) + (green2 * 0.7152) + (blue2 * 0.0722);
 var z = (red2 * 0.0193) + (green2 * 0.1192) + (blue2 * 0.9505);
 var xyzresult = new Array();
 xyzresult[0] = x;
 xyzresult[1] = y;
 xyzresult[2] = z;
 return(xyzresult);
} //end of rgb_to_xyz function
function xyztolab(xyz){ //a convertor from xyz to lab model
 var x = xyz[0];
 var y = xyz[1];
 var z = xyz[2];
 var x2 = x/95.047;
 var y2 = y/100;
 var z2 = z/108.883;
 if(x2>0.008856){
      x2 = Math.pow(x2,1/3);
 }
 else{
      x2 = (7.787*x2) + (16/116);
 }
 if(y2>0.008856){
      y2 = Math.pow(y2,1/3);
 }
 else{
      y2 = (7.787*y2) + (16/116);
 }
 if(z2>0.008856){
      z2 = Math.pow(z2,1/3);
 }
 else{
      z2 = (7.787*z2) + (16/116);
 }
 var l= 116*y2 - 16;
 var a= 500*(x2-y2);
 var b= 200*(y2-z2);
 var labresult = new Array();
 labresult[0] = l;
 labresult[1] = a;
 labresult[2] = b;
 return(labresult);

}

    var canvas = document.getElementById('myCanvas');
    var context = canvas.getContext('2d');
    var imageX = 0;
    var imageY = 0;

    context.drawImage(imageObj1, imageX, imageY, 240, 140);
    var imageData = context.getImageData(0, 0, 240, 140);
    var data = imageData.data;
    var n = data.length;
   // iterate over all pixels

    var m = 0;
    for (var i = 0; i < n; i += 4) {
      var red = data[i];
      var green = data[i + 1];
      var blue = data[i + 2];
    var xyzcolor = new Array();
    xyzcolor = rgbtoxyz(red,green,blue);
    var lab = new Array();
    lab = xyztolab(xyzcolor);
    constants.colorMap.push(lab); //fill up the colormap array with lab colors.         
      } 

  }

// ------------------------------------------------ -------------------------------------------------- ---

    function colorize(pixqty) {

         function deltae94(lab1,lab2){    //calculating Delta E 1994

         var c1 = Math.sqrt((lab1[1]*lab1[1])+(lab1[2]*lab1[2]));
         var c2 =  Math.sqrt((lab2[1]*lab2[1])+(lab2[2]*lab2[2]));
         var dc = c1-c2;
         var dl = lab1[0]-lab2[0];
         var da = lab1[1]-lab2[1];
         var db = lab1[2]-lab2[2];
         var dh = Math.sqrt((da*da)+(db*db)-(dc*dc));
         var first = dl;
         var second = dc/(1+(0.045*c1));
         var third = dh/(1+(0.015*c1));
         var deresult = Math.sqrt((first*first)+(second*second)+(third*third));
         return(deresult);
          } // end of deltae94 function
    var lab11 =  new Array("80","-4","21");
    var lab12 = new Array();
    var k2=0;
    var canvas = document.getElementById('myCanvas');
                                        var context = canvas.getContext('2d');
                                        var imageData = context.getImageData(0, 0, 240, 140);
                                        var data = imageData.data;

    for (var i=0; i<pixqty; i++) {

    lab12 = constants.colorMap[i];

    var deltae = deltae94(lab11,lab12);     
                                        if (deltae <= 10) {

                                        data[i*4] = 255;
                                        data[(i*4)+1] = 0;
                                        data[(i*4)+2] = 0;  
                                        k2++;
                                        } // end of if 
                                } //end of for loop
    context.clearRect(0,0,240,140);
    alert(k2);
    context.putImageData(imageData,0,0);
} 
// -----------------------------------------------------------------------------------------------------

$(window).load(function () {    
  var imageObj = new Image();
  imageObj.onload = function() {
  fillcolormap(imageObj);    
  }
  imageObj.src = './mixcolor.png';
});

// ---------------------------------------------------------------------------------------------------
 var pixno2 = 240*140; 
 </script>

1
我对您的某些整数除法有些担心。 1/316/116这两种计算结果0,这是几乎可以肯定不是你想要的。可能您的算法正确,但您的代码肯定不正确。
Dawood Ibn Kareem

您正在描述CIE-LAB dE94。Delta E表示欧几里得的变化。也就是说,在标准Lab色彩空间中,由您非常标准的欧式距离公式给出的欧式距离。而对Delta E的修改(即76、94、2000(还有用于纺织品等的Delta E,CMC))则是Lab色彩空间内位置之间的距离公式不同。每个实验室的代码都相同,而色差的代码则不同。。简而言之,不是DeltaE。
2015年

2

一个仅使用RGB的简单方法是

cR=R1-R2 
cG=G1-G2 
cB=B1-B2 
uR=R1+R2 
distance=cR*cR*(2+uR/256) + cG*cG*4 + cB*cB*(2+(255-uR)/256)

我已经使用了一段时间了,它在大多数情况下都能正常工作。


使用上述公式,距离的值范围是多少
Aman Aggarwal

这与欧几里得色差近似非常接近。我猜它正在跳过根组件以加快计算速度,所以它的范围是0到100 ^ 3。如果要归一化为100,请距离1/3
丹尼尔(Daniel)

2

我在我的android系统中使用了它,尽管不建议使用RGB空间,但似乎令人满意:

    public double colourDistance(int red1,int green1, int blue1, int red2, int green2, int blue2)
{
      double rmean = ( red1 + red2 )/2;
    int r = red1 - red2;
    int g = green1 - green2;
    int b = blue1 - blue2;
    double weightR = 2 + rmean/256;
    double weightG = 4.0;
    double weightB = 2 + (255-rmean)/256;
    return Math.sqrt(weightR*r*r + weightG*g*g + weightB*b*b);
}

然后,我使用以下代码获取相似性百分比:

double maxColDist = 764.8339663572415;
double d1 = colourDistance(red1,green1,blue1,red2,green2,blue2);
String s1 = (int) Math.round(((maxColDist-d1)/maxColDist)*100) + "% match";

它足够好用。


2

我尝试了各种方法,例如LAB色彩空间,HSV比较,并且我发现光度可以很好地达到此目的。

这是Python版本

def lum(c):
    def factor(component):
        component = component / 255;
        if (component <= 0.03928):
            component = component / 12.92;
        else:
            component = math.pow(((component + 0.055) / 1.055), 2.4);

        return component
    components = [factor(ci) for ci in c]

    return (components[0] * 0.2126 + components[1] * 0.7152 + components[2] * 0.0722) + 0.05;

def color_distance(c1, c2):

    l1 = lum(c1)
    l2 = lum(c2)
    higher = max(l1, l2)
    lower = min(l1, l2)

    return (higher - lower) / higher


c1 = ImageColor.getrgb('white')
c2 = ImageColor.getrgb('yellow')
print(color_distance(c1, c2))

会给你

0.0687619047619048

的起源是ImageColor什么?编辑我发现,它是from PIL import ImageColor
ademar111190 '19

亮度不是颜色的亮度吗?因此,在这种情况下,只要亮度相同,绿色,蓝色和红色就不会被报告为不同?
Peter B.

1

我希望您最后要分析整个图像,不是吗?因此,您可以检查与标识颜色矩阵的最小/最大差异。

大多数用于处理图形的数学运算都使用矩阵,因为使用它们的可能算法通常比经典的逐点距离和比较计算更快。(例如,用于使用DirectX,OpenGL等的操作)

所以我认为您应该从这里开始:

http://en.wikipedia.org/wiki/Identity_matrix

http://en.wikipedia.org/wiki/Matrix_difference_equation

...并且正如Beska在上面已经评论的那样:

这可能无法提供最佳的“可见”差异。

这也意味着,如果要处理图像,算法将取决于您对“类似”的定义。


1

Kotlin版本,您要匹配多少百分比。

具有百分比可选参数的方法调用

isMatchingColor(intColor1, intColor2, 95) // should match color if 95% similar

方法主体

private fun isMatchingColor(intColor1: Int, intColor2: Int, percent: Int = 90): Boolean {
    val threadSold = 255 - (255 / 100f * percent)

    val diffAlpha = abs(Color.alpha(intColor1) - Color.alpha(intColor2))
    val diffRed = abs(Color.red(intColor1) - Color.red(intColor2))
    val diffGreen = abs(Color.green(intColor1) - Color.green(intColor2))
    val diffBlue = abs(Color.blue(intColor1) - Color.blue(intColor2))

    if (diffAlpha > threadSold) {
        return false
    }

    if (diffRed > threadSold) {
        return false
    }

    if (diffGreen > threadSold) {
        return false
    }

    if (diffBlue > threadSold) {
        return false
    }

    return true
}

0

您需要将任何RGB颜色转换为Lab颜色空间,以便能够以人类看到它们的方式进行比较。否则,您将获得以某些非常奇怪的方式“匹配”的RGB颜色。

色差 ”上的Wikipedia链接向您介绍了多年来定义的各种Lab颜色空间色差算法。最简单的方法是检查两种实验室颜色的欧几里得距离,可以工作,但有一些缺陷。

方便的是,OpenIMAJ项目中有一个Java的更复杂的CIEDE2000算法实现。为它提供两组Lab颜色,它将为您提供单个距离值。


0

比较颜色的唯一“正确”方法是在CIELab或CIELuv中使用deltaE进行比较。

但是对于许多应用程序,我认为这是一个足够好的近似值:

distance = 3 * |dR| + 4 * |dG| + 3 * |dB|

我认为加权曼哈顿距离在比较颜色时更有意义。请记住,原色只在我们的脑海中。它们没有任何物理意义。CIELab和CIELuv是根据我们对颜色的感知进行统计建模的。


0

为了快速而肮脏,您可以

import java.awt.Color;
private Color dropPrecision(Color c,int threshold){
    return new Color((c.getRed()/threshold),
                     (c.getGreen()/threshold),
                     (c.getBlue()/threshold));
}
public boolean inThreshold(Color _1,Color _2,int threshold){
    return dropPrecision(_1,threshold)==dropPrecision(_2,threshold);
}

利用整数除法量化颜色。


0

斯威夫特5答案

我找到此线程是因为我需要此问题的Swift版本。没有人回答该解决方案,这是我的:

extension UIColor {

    var rgba: (red: CGFloat, green: CGFloat, blue: CGFloat, alpha: CGFloat) {
        var red: CGFloat = 0
        var green: CGFloat = 0
        var blue: CGFloat = 0
        var alpha: CGFloat = 0
        getRed(&red, green: &green, blue: &blue, alpha: &alpha)

        return (red, green, blue, alpha)
    }

    func isSimilar(to colorB: UIColor) -> Bool {
        let rgbA = self.rgba
        let rgbB = colorB.rgba

        let diffRed = abs(CGFloat(rgbA.red) - CGFloat(rgbB.red))
        let diffGreen = abs(rgbA.green - rgbB.green)
        let diffBlue = abs(rgbA.blue - rgbB.blue)

        let pctRed = diffRed
        let pctGreen = diffGreen
        let pctBlue = diffBlue

        let pct = (pctRed + pctGreen + pctBlue) / 3 * 100

        return pct < 10 ? true : false
    }
}

用法:

let black: UIColor = UIColor.black
let white: UIColor = UIColor.white

let similar: Bool = black.isSimilar(to: white)

我设置小于10%的差异以返回相似的颜色,但是您可以自己定制。


0

Android for ColorUtils API RGBToHSL: 我有两种int argb颜色(color1,color2),我想获得两种颜色之间的距离/差异。这是我所做的;

private float getHue(int color) {
    int R = (color >> 16) & 0xff;
    int G = (color >>  8) & 0xff;
    int B = (color      ) & 0xff;
    float[] colorHue = new float[3];
    ColorUtils.RGBToHSL(R, G, B, colorHue);
    return colorHue[0];
}

然后,我使用下面的代码查找两种颜色之间的距离。

private float getDistance(getHue(color1), getHue(color2)) {
    float avgHue = (hue1 + hue2)/2;
    return Math.abs(hue1 - avgHue);
}
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.