我一直在编写一个图像处理程序,通过
HTML5画布像素处理应用效果.我已经实现了Thresholding,Vintaging和ColorGradient像素操作,但令人难以置信的是,我无法改变图像的对比度！
我已经尝试了多种解决方案,但是我总是在图片中获得太多的亮度,减少对比度效果,而且我不打算使用任何 Javascript库,因为我本来试图实现这些效果.
我已经尝试了多种解决方案,但是我总是在图片中获得太多的亮度,减少对比度效果,而且我不打算使用任何 Javascript库,因为我本来试图实现这些效果.
基本像素操作码：
var data = imageData.data;
for (var i = 0; i < data.length; i += 4) {
//Note: data[i],data[i+1],data[i+2] represent RGB respectively
data[i] = data[i];
data[i+1] = data[i+1];
data[i+2] = data[i+2];
}
像素操作示例
值处于RGB模式,这意味着数据[i]是红色.所以如果data [i] = data [i] * 2;该像素的红色通道的亮度将增加到两倍.例：
var data = imageData.data;
for (var i = 0; i < data.length; i += 4) {
//Note: data[i],data[i+2] represent RGB respectively
//Increases brightness of RGB channel by 2
data[i] = data[i]*2;
data[i+1] = data[i+1]*2;
data[i+2] = data[i+2]*2;
}
*注意：我不是要你们完成代码！这只是一个好处！我要求一个算法(甚至是伪代码),显示像素操作的对比度如何！
如果有人可以为HTML5画布中的Image Contrast提供一个很好的算法,我会很高兴.
解决方法
在尝试了Schahriar SaffarShargh的答案之后,它的表现不像对比应该表现的那样.我终于遇到了这个算法,它的作用就像一个魅力！
有关算法的其他信息,请参阅this article及其注释部分.
function contrastImage(imageData,contrast) {
var data = imageData.data;
var factor = (259 * (contrast + 255)) / (255 * (259 - contrast));
for(var i=0;i<data.length;i+=4)
{
data[i] = factor * (data[i] - 128) + 128;
data[i+1] = factor * (data[i+1] - 128) + 128;
data[i+2] = factor * (data[i+2] - 128) + 128;
}
return imageData;
}
用法：
var newImageData = contrastImage(imageData,30);
希望这将是一个节省时间的人.干杯!
