javascript - 色の明るさを変える

Question

重複の可能性:
jquery/javascript でクリック時に CSS の明るさの色を増やしますか?

JavaScript では、MSPaint で行うことができるように、赤、青、緑の値を知っている場合、どのように色の明るさを変更できますか?

Answer 1

質問は Javascript とは関係ありません。あなたが MSPaint にどのような影響を与えているのかわかりません。さらに、明るさを調整するためだけに色空間を変換すると、コストがかかりすぎる可能性があります。あなたにとって十分な、はるかに単純なアプローチがあります。これは、すばやく簡単に実行できるガンマ補正です。赤、緑、青の値が [0, 255] の範囲にある場合は、範囲 [0, 255]lutの特定の値にガンマ補正をすばやく適用するために使用されるルックアップ テーブル ( ) を簡単に作成することもできます。 255]。このメソッドの擬似コードは次のとおりです。

GAMMA = k

lut = []
for i = 0 to 255
    v = i/255.0
    lut.push(round(255 * (v ^ GAMMA)))

foreach x, y in image
    image[x, y] = lut[image[x, y]]

1 より大きい値はkイメージを明るくし、1 より小さい値はイメージを暗くします。ガンマ補正は、各ピクセル コンポーネント (つまり、赤、緑、青を個別に) に適用されます。k = 1, 2, 3それぞれ , を使用した例を次に示します。

これを実行するための完全な Python コード (Javascript の翻訳に役立つ場合があります):

import sys
from PIL import Image

GAMMA = 1/3.0

lut = []
for i in xrange(256):
    v = i/255.
    lut.append(round(255 * (v ** GAMMA)))

img = Image.open(sys.argv[1])
img = img.point(lambda x: lut[x])
img.save(sys.argv[2])