Javascript图像处理—亮度对比度应用案例(js 图像)

编辑：rootadmin

前言

上一篇文章，我们讲解了图像处理中的卷积操作和平滑（也就是模糊）处理，这篇文章我们进行亮度和对比度的变化。

其实，亮度是啥玩意？

亮度就是比较亮眼咯……

实际上对于RGBA颜色空间，变亮其实就等于R、G、B三个通道同时加大，那么变暗就等于同时减小咯。

这比较好理解，因为最暗的黑色是RGB(0,0,0)，而最亮的白色是RGB(,,)。所以变亮应该RGB各通道都要增大。

那么，对比度呢？

对比度，其实就是颜色差啦。

那么对于RGBA颜色空间，对比度变大其实就等于R、G、B三个通道同时乘以一个比例，因为这样相近的颜色之间的差距就变大了，那么减小就是同时除以咯。

举个例子，原来RGB(,,)和RGB(,,)相差只有，但是一起乘以2以后，就变成了RGB(,,)和RGB(,,)

，相差变成了了，也就是“颜色差”变大了。

线性模型

newRGB = Contrast * RGB + Brightness

线性模型满足上述公式，其中 Contrast表示对比度系数，Brightness表示亮度系数。

线性模型实现比较简单，但是很容易就调出全白或者全黑的图片，对于普通用户来说Contrast、Brightness选多少比较好也比较难确定。

所以，实际上在Photoshop里面使用的并不是线性模型，而是非线性模型。

非线性模型

非线性模型中对比度增大和阈值Threshold有关：

当Contrast >= 0时：

newRGB = RGB + (RGB - Threshold) * (1 / (1 - Contrast / ) - 1)

当Contrast < 0时：

newRGB = RGB + (RGB - Threshold) * Contrast /

那么当对比度和亮度同时调整时候呢？

如果对比度大于0，先调整亮度，再调整对比度；当对比度小于0时，则相反，先调整对比度，再调整亮度。

最后一个问题，阈值Threshold到底是什么，其实这个是图片的灰度平均值。

实现代码效果

推荐整理分享Javascript图像处理—亮度对比度应用案例(js 图像)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:JavaScript图像处理,js可以对图片进行的所有操作,js实现图片3d效果,js 图像,js实现图片3d效果,javascript 绘图,javascript绘图库,JavaScript图像处理,内容如对您有帮助，希望把文章链接给更多的朋友！

表单的焦点顺序tabindex和对应enter键提交表单的焦点tab键顺序：tabindex决定，如果值缺省，择按顺序用户:inputname="Text1"type="text"tabindex="1"/密码:inputname="Password1"type="password"tabindex="2"对应onsubmit事件

javascript编码的几个方法详细介绍 escape定义和用法escape()函数可对字符串进行编码，这样就可以在所有的计算机上读取该字符串。参数描述string必需。要被转义或编码的字符串。返回值已

js获取height和width的方法说明 !DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""

标签: js 图像

本文链接地址:https://www.jiuchutong.com/biancheng/379126.html 转载请保留说明！

上一篇：javascript学习(二)javascript常见问题总结(javascript基础入门教程)

下一篇：表单的焦点顺序tabindex和对应enter键提交(表单失去焦点事件)