RGB操作公式

时间:2011-07-13 11:27:08

标签: javascript rgb html5-canvas

我一直在尝试HTML5 canvas api,并编写了一个脚本,可以从彩色图像中创建黑白图像。

我正在使用的RGB到灰度的公式是:r * 0.2989 + g * 0.5870 + b * 0.1140

我想知道是否有人知道通过RGB值操作图像的更多公式。

2 个答案:

答案 0 :(得分:5)

这里有一些

// ADD
c = Math.min( 255, Math.max( 0, c0 + c1 ) )
// SUBTRACT
c = Math.max( 0, c0 - c1 )
// MULTIPLY
c = Math.floor( ( c1 * c0 ) / 0xff )
// SCREEN
c = 255 - Math.floor( ( 255 - c0 ) * ( 255 - c1 ) / 255 )
// LIGHTEN
c = c0 > c1 ? c0 : c1
// DARKEN
c = c0 < c1 ? c0 : c1
// DIFFERENCE
c = c0 > c1 ? c0 - c1 : c1 - c0
// INVERT ( no influence from c1 )
c = 255 - c0
// OVERLAY
c = c0 < 128 ? Math.floor( ( c1 * c0 ) / 127 ) : 255 - Math.ceil( ( 255 - c0 ) * ( 255 - c1 ) / 127 )
// HARDLIGHT
c = c1 < 128 ? Math.floor( ( c1 * c0 ) / 127 ) : 255 - Math.ceil( ( 255 - c0 ) * ( 255 - c1 ) / 127 )

其中c0和c1是颜色十进制值,c是输出值

答案 1 :(得分:1)

这是一种使图像变暗的方法:

 (r*0.5) + (g*0.5) + (b*0.5)

还有其他几种操作RGB颜色的方法,例如阈值处理,交换颜色通道,仅显示红色,绿色或蓝色通道,反转颜色,以及对比度和亮度等。使用这些关键字搜索Web可以揭示更改图像颜色的其他方法。 This question解释了如何制作现有颜色的色调或阴影。请特别注意关于线性RGB和伽马校正的评论。