Javascript图像处理：平滑处理

Javascript图像处理：平滑处理2013-10-12 Justany_WhiteSnow 不详前言

上一篇文章，我们讲解了图像的虚拟边缘，这篇文章开始进行平滑（也就是模糊）处理。

基本原理

这里直接引用OpenCV 2.4+ C++ 平滑处理和OpenCV 2.4+ C++ 边缘梯度计算的相关内容：

平滑也称模糊, 是一项简单且使用频率很高的图像处理方法。

平滑处理时需要用到一个滤波器。最常用的滤波器是线性滤波器，线性滤波处理的输出像素值（例如：g（i,j））是输入像素值（例如：f（i+k,j+l））的加权平均：

g（i,j） = sum_{k,l} f（i+k, j+l） h（k,l）

h（k,l）称为核, 它仅仅是一个加权系数。

这里涉及一种叫做“卷积”的运算，那么卷积是什么呢？

卷积是在每一个图像块与某个算子（核）之间进行的运算。

核？！

核就是一个固定大小的数值数组。该数组带有一个锚点，一般位于数组中央。

kernel example

可是这怎么运算啊？

假如你想得到图像的某个特定位置的卷积值，可用下列方法计算：

将核的锚点放在该特定位置的像素上，同时，核内的其他值与该像素邻域的各像素重合；

将核内各值与相应像素值相乘，并将乘积相加；

将所得结果放到与锚点对应的像素上；

对图像所有像素重复上述过程。

用公式表示上述过程如下：

H（x,y） = sum_{i=0}^{M_{i} - 1} sum_{j=0}^{M_{j}-1} I（x+i - a_{i}, y + j - a_{j}）K（i,j）

在图像边缘的卷积怎么办呢？

计算卷积前，需要通过复制源图像的边界创建虚拟像素，这样边缘的地方也有足够像素计算卷积了。这就是为什么上一篇文章需要做虚拟边缘函数。

均值平滑

均值平滑实际上就是内核元素全是1的卷积运算，然后再除以内核的大小，用数学表达式来表示就是：

texttt{K} = frac{1}{texttt{ksize.width*ksize.height}} begin{bmatrix} 1 & 1 & 1 & cdots & 1 & 11 & 1 & 1 & cdots & 1 & 1hdotsfor{6}1 & 1 & 1 & cdots & 1 & 1end{bmatrix}