脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → Javascript图像处理 阈值函数

Javascript图像处理—阈值函数实例应用

 更新时间：2013年01月03日 14:47:32   作者：  
阈值是最简单的图像分割方法,接下来将介绍五种阈值类型感兴趣的朋友可以参考下
前言

上一篇文章，我们讲解了图像处理中的亮度和对比度的变化，这篇文章我们来做一个阈值函数。

最简单的图像分割方法

阈值是最简单的图像分割方法。

比如为了从下图中分割出苹果，我们利用前景与背景的灰度差值，通过设定一个阈值，对于该像素大于这个阈值时就以黑色表示，小于便以灰色表示。

Threshold simple example
五种阈值类型

和OpenCV一样，我们将提供五种阈值类型，方便使用。

下面是原图像的波形表示，纵坐标表示像素点的灰度值大小，蓝线是阈值大小。

Threshold Binary

二进制阈值化

公式表示是：

\texttt{dst} (x,y) = \fork{\texttt{maxVal}}{if $\texttt{src}(x,y) > \texttt{thresh}$}{0}{otherwise}

图像表示是：

Threshold Binary

可见超过该阈值的就变成最大值（即255），否则变成最小值（也就是0）。我们需要一个函数来实现这个功能：

复制代码 代码如下:

var CV_THRESH_BINARY = function(__value, __thresh, __maxVal){
return __value > __thresh ? __maxVal : 0;
};

反二进制阈值化

公式表示是：

\texttt{dst} (x,y) = \fork{0}{if $\texttt{src}(x,y) > \texttt{thresh}$}{\texttt{maxVal}}{otherwise}

图像表示是：

Threshold Binary Inverted

这个则反过来，超过阈值的变成最小值，否则变成最大值。函数实现是：

复制代码 代码如下:

var CV_THRESH_BINARY_INV = function(__value, __thresh, __maxVal){
return __value > __thresh ? 0 : __maxVal;
};

截断阈值化

公式表示是：

\texttt{dst} (x,y) = \fork{\texttt{threshold}}{if $\texttt{src}(x,y) > \texttt{thresh}$}{\texttt{src}(x,y)}{otherwise}

图像表示是：

Threshold Truncate

可见这个是超过阈值的就被截断。函数实现是：

复制代码 代码如下:

var CV_THRESH_TRUNC = function(__value, __thresh, __maxVal){
return __value > __thresh ? __thresh : 0;
};

阈值化为0

公式表示是：

\texttt{dst} (x,y) = \fork{\texttt{src}(x,y)}{if $\texttt{src}(x,y) > \texttt{thresh}$}{0}{otherwise}

图像表示是：

Threshold Zero

这个则是小于阈值的都化为0处理。函数实现：

复制代码 代码如下:

var CV_THRESH_TOZERO = function(__value, __thresh, __maxVal){
return __value > __thresh ? __value : 0;
};

反阈值化为0

公式表示是：

\texttt{dst} (x,y) = \fork{0}{if $\texttt{src}(x,y) > \texttt{thresh}$}{\texttt{src}(x,y)}{otherwise}

图像表示是：

Threshold Zero Inverted

这个则在超过阈值时候置为0，函数实现是：

复制代码 代码如下:

var CV_THRESH_TOZERO_INV = function(__value, __thresh, __maxVal){
return __value > __thresh ? 0 : __value;
};

阈值处理函数实现

然后我们做一个函数对整幅图进行上面这几种类型的阈值处理。

复制代码 代码如下:

var threshold = function(__src, __thresh, __maxVal, __thresholdType, __dst){
(__src && __thresh) || error(arguments.callee, IS_UNDEFINED_OR_NULL/* {line} */);
if(__src.type && __src.type == "CV_GRAY"){
var width = __src.col,
height = __src.row,
sData = __src.data,
dst = __dst || new Mat(height, width, CV_GRAY),
dData = dst.data,
maxVal = __maxVal || 255,
threshouldType = __thresholdType || CV_THRESH_BINARY;

var i, j, offset;

for(i = height; i--;){
for(j = width; j--;){
offset = i * width + j;
dData[offset] = threshouldType(sData[offset], __thresh, maxVal);
}
}

}else{
error(arguments.callee, UNSPPORT_DATA_TYPE/* {line} */);
}

return dst;
};

这个函数比较简单，就是对每个像素点赋值为
复制代码 代码如下:

threshouldType(sData[offset], __thresh, maxVal)

返回的数值。

您可能感兴趣的文章:

相关文章

  • JavaScript html5 canvas绘制时钟效果(二)

    JavaScript html5 canvas绘制时钟效果(二)

    这篇文章主要介绍了JavaScript html5绘制时钟效果的相关资料，使用HTML5的canvas标签和Javascript脚本，模拟显示了一个时钟，感兴趣的小伙伴们可以参考一下
    2016-03-03
  • 利用Pjax下载动态加载插件方案分享

    利用Pjax下载动态加载插件方案分享

    在纯静态网站里，有时候会动态更新某个区域往会选择 Pjax（swup、barba.js）去处理。本文主要和大家分享下Pjax下载动态加载插件方案，感兴趣的可以了解一下
    2022-09-09
  • JScript实现地址选择功能

    JScript实现地址选择功能

    这篇文章主要为大家详细介绍了JScript实现地址选择功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2017-08-08
  • 解决OneThink中无法异步提交kindeditor文本框中修改后的内容方法

    解决OneThink中无法异步提交kindeditor文本框中修改后的内容方法

    下面小编就为大家带来一篇解决OneThink中无法异步提交kindeditor文本框中修改后的内容方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
    2017-05-05
  • 原生js+cookie实现购物车功能的方法分析

    原生js+cookie实现购物车功能的方法分析

    这篇文章主要介绍了原生js+cookie实现购物车功能的方法,结合实例形式分析了javascript结合cookie存储实现购物车功能的相关操作技巧,需要的朋友可以参考下
    2017-12-12
  • 手把手教你 CKEDITOR 4 扩展插件制作

    手把手教你 CKEDITOR 4 扩展插件制作

    这篇文章主要介绍了手把手教你 CKEDITOR 4 扩展插件制作,结合具体实例形式详细分析了CKEditor4插件制作的步骤与相关操作注意事项,需要的朋友可以参考下
    2019-06-06
  • 详解uniapp分包的实现方式及优点

    详解uniapp分包的实现方式及优点

    当今移动应用开发领域,随着用户对于应用功能和体验的要求不断提高,应用程序的复杂度也在不断增加,在这种情况下,应用程序的体积也随之增大,为了解决这个问题,Uniapp提供了分包功能,本文将详细介绍Uniapp分包的功能和优势,包括如何通过配置文件实现分包
    2023-09-09
  • 原生js实现简单贪吃蛇小游戏

    原生js实现简单贪吃蛇小游戏

    这篇文章主要为大家详细介绍了原生js实现贪吃蛇小游戏，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2021-06-06
  • Javascript的原型和原型链你了解吗

    Javascript的原型和原型链你了解吗

    这篇文章主要为大家详细介绍了Javascript的原型和原型链，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能够给你带来帮助
    2022-03-03
  • 开启Javascript中apply、call、bind的用法之旅模式

    开启Javascript中apply、call、bind的用法之旅模式

    在Javascript中，Function是一种对象。Function对象中的this指向决定于函数被调用的方式,使用apply，call 与 bind 均可以改变函数对象中this的指向。
    2015-10-10

最新评论