灰度滤镜

黑白滤镜

反向滤镜

去色滤镜

单色滤镜

高斯模糊滤镜

怀旧滤镜

熔铸滤镜

冰冻滤镜

连环画滤镜

褐色滤镜

灰度滤镜

将颜色的RGB设置为相同的值即可使得图片为灰色，一般处理方法有：

1、取三种颜色的平均值

2、取三种颜色的最大值（最小值）

3、加权平均值：0.3R + 0.59G + 0.11*B

for(var i = 0; i < data.length; i+=4) {var grey = (data[i] + data[i+1] + data[i+2]) / 3;data[i] = data[i+1] = data[i+2] = grey;
}

黑白滤镜

顾名思义，就是图片的颜色只有黑色和白色，可以计算rgb的平均值arg，arg>=100，r=g=b=255，否则均为0

for(var i = 0; i < data.length; i += 4) {var avg = (data[i] + data[i+1] + data[i+2]) / 3;data[i] = data[i+1] = data[i+2] = avg >= 100 ? 255 : 0;
}

反向滤镜

就是RGB三种颜色分别取255的差值。

for(var i = 0; i < data.length; i+= 4) {data[i] = 255 - data[i];data[i + 1] = 255 - data[i + 1];data[i + 2] = 255 - data[i + 2];
}

去色滤镜

rgb三种颜色取三种颜色的最值的平均值。

for(var i = 0; i < data.length; i++) {var avg = Math.floor((Math.min(data[i], data[i+1], data[i+2]) + Math.max(data[i], data[i+1], data[i+2])) / 2 );data[i] = data[i+1] = data[i+2] = avg;
}

单色滤镜

就是只保留一种颜色，其他颜色设为0

for(var i = 0; i < canvas.height * canvas.width; i++) {data[i*4 + 2] = 0;data[i*4 + 1] = 0;
}

高斯模糊滤镜

高斯模糊的原理就是根据正态分布使得每个像素点周围的像素点的权重不一致，将各个权重（各个权重值和为1）与对应的色值相乘，所得结果求和为中心像素点新的色值。我们需要了解的高斯模糊的公式：

function gaussBlur(imgData, radius, sigma) {var pixes = imgData.data,height = imgData.height,width = imgData.width,radius = radius || 5;sigma = sigma || radius / 3;var gaussEdge = radius * 2 + 1;var gaussMatrix = [],gaussSum = 0,a = 1 / (2 * sigma * sigma * Math.PI),b = -a * Math.PI;for(var i = -radius; i <= radius; i++) {for(var j = -radius; j <= radius; j++) {var gxy = a * Math.exp((i * i + j * j) * b);gaussMatrix.push(gxy);gaussSum += gxy;}}var gaussNum = (radius + 1) * (radius + 1);for(var i = 0; i < gaussNum; i++) {gaussMatrix[i] /= gaussSum;}for(var x = 0; x < width; x++) {for(var y = 0; y < height; y++) {var r = g = b = 0;for(var i = -radius; i<=radius; i++) {var m = handleEdge(i, x, width);for(var j = -radius; j <= radius; j++) {var mm = handleEdge(j, y, height);var currentPixId = (mm * width + m) * 4;var jj = j + radius;var ii = i + radius;r += pixes[currentPixId] * gaussMatrix[jj * gaussEdge + ii];g += pixes[currentPixId + 1] * gaussMatrix[jj * gaussEdge + ii];b += pixes[currentPixId + 2] * gaussMatrix[jj * gaussEdge + ii];}}var pixId = (y * width + x) * 4;pixes[pixId] = ~~r;pixes[pixId + 1] = ~~g;pixes[pixId + 2] = ~~b;}}imgData.data = pixes;return imgData;
}function handleEdge(i, x, w) {var m = x + i;if(m < 0) {m = -m;} else if(m >= w) {m = w + i -x;}return m;
}

怀旧滤镜

for(var i = 0; i < imgData.height * imgData.width; i++) {var r = imgData.data[i*4],g = imgData.data[i*4+1],b = imgData.data[i*4+2];var newR = (0.393 * r + 0.769 * g + 0.189 * b);var newG = (0.349 * r + 0.686 * g + 0.168 * b);var newB = (0.272 * r + 0.534 * g + 0.131 * b);var rgbArr = [newR, newG, newB].map((e) => {return e < 0 ? 0 : e > 255 ? 255 : e;});[imgData.data[i*4], imgData.data[i*4+1], imgData.data[i*4+2]] = rgbArr;
}

熔铸滤镜

公式： r = r128/(g+b +1); g = g128/(r+b +1); b = b*128/(g+r +1);

for(var i = 0; i < imgData.height * imgData.width; i++) {var r = imgData.data[i*4],g = imgData.data[i*4+1],b = imgData.data[i*4+2];var newR = r * 128 / (g + b + 1);var newG = g * 128 / (r + b + 1);var newB = b * 128 / (g + r + 1);var rgbArr = [newR, newG, newB].map((e) => {return e < 0 ? 0 : e > 255 ? 255 : e;});[imgData.data[i*4], imgData.data[i*4+1], imgData.data[i*4+2]] = rgbArr;
}

冰冻滤镜

公式： r = (r-g-b)*3/2; g = (g-r-b)*3/2; b = (b-g-r)*3/2;

for(var i = 0; i < imgData.height * imgData.width; i++) {var r = imgData.data[i*4],g = imgData.data[i*4+1],b = imgData.data[i*4+2];var newR = (r - g -b) * 3 /2;var newG = (g - r -b) * 3 /2;var newB = (b - g -r) * 3 /2;var rgbArr = [newR, newG, newB].map((e) => {return e < 0 ? 0 : e > 255 ? 255 : e;});[imgData.data[i*4], imgData.data[i*4+1], imgData.data[i*4+2]] = rgbArr;
}

连环画滤镜

公式： R = |g – b + g + r| * r / 256

G = |b – g + b + r| * r / 256;

B = |b – g + b + r| * g / 256;

for (var i = 0; i < imgData.height * imgData.width; i++) {var r = imgData.data[i * 4],g = imgData.data[i * 4 + 1],b = imgData.data[i * 4 + 2];var newR = r * 0.393 + g * 0.769 + b * 0.189;var newG = r * 0.349 + g * 0.686 + b * 0.168;var newB =  r * 0.272 + g * 0.534 + b * 0.131;var rgbArr = [newR, newG, newB];[imgData.data[i * 4], imgData.data[i * 4 + 1], imgData.data[i * 4 + 2]] = rgbArr;
}

褐色滤镜

公式： r = r * 0.393 + g * 0.769 + b * 0.189; g = r * 0.349 + g * 0.686 + b * 0.168; b = r * 0.272 + g * 0.534 + b * 0.131;

for (var i = 0; i < imgData.height * imgData.width; i++) {var r = imgData.data[i * 4],g = imgData.data[i * 4 + 1],b = imgData.data[i * 4 + 2];var newR = r * 0.393 + g * 0.769 + b * 0.189;var newG = r * 0.349 + g * 0.686 + b * 0.168;var newB =  r * 0.272 + g * 0.534 + b * 0.131;var rgbArr = [newR, newG, newB];[imgData.data[i * 4], imgData.data[i * 4 + 1], imgData.data[i * 4 + 2]] = rgbArr;
}

https://blog.csdn.net/weixin_34198881/article/details/88039549

【图像处理】中的“滤镜算法”：灰度、黑白、反向、去色、单色、高斯模糊、怀旧、连环画相关推荐

Java美颜相机入门（图像处理实现各种滤镜算法）
一.思路分析一款简易美颜相机的功能我们可以简单分为两大块:1.图像处理 2.功能区最终的效果图如下: 二.代码分析图像处理工具的本质是处理像素点,而像素点的本质就是一种颜色,每一个像素点都 ...
图像处理中的模糊算法
平滑在数字图像上进行平滑操作,就是需要用模板(高斯模板,均值模板)在图像上做卷积,得到新值,这就是模糊的原理.卷积核中的每个元素叫做卷积系数,卷积核中卷积系数的大小.方向及排列次序决定图像卷积后处理 ...
图像处理中的亮度，灰度，对比度等概念
参考 : http://www.360doc.com/content/18/0410/09/7551_744364416.shtml 图像的亮度: 这是图像表达中的一个重要概念, 我们可以用函数 f( ...
python卡通滤镜_纯Python综合图像处理小工具（3）10种滤镜算法
滤镜处理是图像处理中一种非常常见的方法.比如photoshop中的滤镜效果,除了自带的滤镜,还扩展了很多第三方的滤镜效果插件,可以对图像做丰富多样的变换:很多手机app实现了实时滤镜功能,最有名的当属 ...
OpenCV图像处理专栏九 | 基于直方图的快速中值滤波算法
转载自:https://zhuanlan.zhihu.com/p/98092747 侵删前言这是OpenCV图像处理专栏的第9篇文章,主要介绍一个基于直方图的快速中值滤波算法,希望对大家有帮助. ...
把计算机视觉算法应用遥感,RANSAC算法及其在遥感图像处理中的应用
摘要: 在计算机视觉,工程设计等领域都需要根据相关数据集确定模型参数,但是所得到的数据中往往存在大量不符合模型的异常数据(又被称为野点),这些野点对模型参数稳健性有很大的干扰.经典的参数估计算法如最小 ...
3 3中值滤波 matlab,MATLAB中值滤波在灰度图像处理中的应用研究和仿真(3)
MATLAB中值滤波在灰度图像处理中的应用研究和仿真(3) 时间:2016-11-30 21:28来源:毕业论文 3.2 中值滤波的仿真 3.2.1 中值滤波仿真函数介绍 MATLAB能够支持多种图像 ...
数字图像处理——中值滤波及其改进算法
一.算法介绍中值滤波器是非线性滤波器的一个例子,它在保留图像特征方面非常有效. 但是,滤波器的窗口大小直接影响中值滤波器的性能. 较小的窗口保留了特征,但会导致噪声抑制的减少. 在较大窗口的情况下, ...
图像处理中涉及的灰度图、彩色图以及深度图概念
图像处理中涉及最多的概念就是图像的类型,为了很好的理解图像的概念以及处理图片,我们就需要对常见的图像具有一定的概念. 我们首先介绍一下生活中常见的图像格式: 1.bmp格式:这是一种不常见的图像格式, ...

【图像处理】中的“滤镜算法”：灰度、黑白、反向、去色、单色、高斯模糊、怀旧、连环画

灰度滤镜

黑白滤镜

反向滤镜

去色滤镜

单色滤镜

高斯模糊滤镜

怀旧滤镜

熔铸滤镜

冰冻滤镜

连环画滤镜

褐色滤镜

【图像处理】中的“滤镜算法”：灰度、黑白、反向、去色、单色、高斯模糊、怀旧、连环画相关推荐

最新文章

热门文章