2

重複の可能性:
パーセンテージに基づいて、2 つの色の間のアンドロイドの色?
2つの色の間のすべての色を見つける方法は?

最初に、RGB の 2 つの色と、それらの間の中間色用の数があります。メソッドは、必要な色の配列を返す必要があります。アルゴリズムの助けが強く必要です。

4

2 に答える 2

7

2 つの色 (R1、G1、B1) (R2、G2、B2) と N 個の中間色があるとします。

for i from 1 to N:
    Ri = R1 + (R2-R1) * i / N
    Bi = B1 + (B2-B1) * i / N
    Gi = G1 + (G2-G1) * i / N
    AddToArray(Ri,Gi,Bi)

それはあなたが探しているものですか？

PS: より自然な色のグラデーションが必要な場合は、RGB ではなく HSL 色空間を使用することをお勧めします。

于 2012-06-23T22:09:16.507 に答える
2

現在の cR、cG、および cB の値を 0% とし、R、G、および B の値を 100% とすると、各反復で i = 1 から 100 まで反復し、cRGB + i * (RGB - cRGB ）。100 個の中間色を使用する必要はありません。N 個を使用できます。

function(currentColor, desiredColor, N) {

    var colors = [],
    cR = currentColor.R,
    cG = currentColor.G,
    cB = currentColor.B,
    dR = desiredColor.R - cR,
    dG = desiredColor.G - cG,
    dB = desiredColor.B - cB;

    for(var i = 1; i <= N; i++) {
        colors.push(new Color(cR + i * dR / N, cG + i * dG / N, cB + i * dB / N));
    }

    return colors;
}

ただし、それではあまり良い中間色が得られません。最初に行うべきことは、色を HSV または同様の色空間に変換することです。強度は色相と彩度から分離されています。これにより、はるかに優れた中間色が得られます。http://en.wikipedia.org/wiki/HSL_and_HSV

これを行うには、まず色を HSV に変換し、上記と同じアルゴリズムを実行しますが、RGB の代わりに HS と V を使用します。ただし、S と V の最小値は 0 で最大値は 1 であり、H は表されます。 0 から 360 までの度数。たとえば、現在の色から目的の色にできるだけ早く移動したい場合は、H で何かを行う必要があるかもしれません。たとえば、cH = 10 で dH = 50 の場合、10 から -> 50最短ですが、cH = 10 かつ dH = 350 の場合、10 から -> -10 (350 度と同じ) の方が短くなります。

于 2012-06-23T22:24:50.577 に答える