亚洲免费在线-亚洲免费在线播放-亚洲免费在线观看-亚洲免费在线观看视频-亚洲免费在线看-亚洲免费在线视频

Javascript圖像處理——圖像形態學

系統 2054 0

前言

上一篇文章 ,我們講解了圖像處理中的閾值函數,這一篇文章我們來做膨脹和腐蝕函數。

?

膨脹與腐蝕

說概念可能很難解釋,我們來看圖,首先是原圖:

膨脹以后會變成這樣:

腐蝕以后則會變成這樣:

看起來可能有些莫名其妙,明明是膨脹,為什么字反而變細了,而明明是腐蝕,為什么字反而變粗了。

實際上,所謂膨脹應該指:

較亮色塊膨脹。

而所謂腐蝕應該指:

較亮色塊腐蝕。

上面圖里面,由于背景白色是較亮色塊,所以膨脹時就把黑色較暗色塊的字壓扁了……相反腐蝕時,字就吸水膨脹了……

用數學公式表示就是:

Javascript圖像處理——圖像形態學_第1張圖片

說白了就是在指定大小的內核里找最暗或者最亮的像素點,并用該點替換掉內核錨點上的像素。?

?

實現

首先我們來實現膨脹dilate函數。

      
        var
      
       dilate = 
      
        function
      
      
        (__src, __size, __borderType, __dst){
    __src 
      
      || error(arguments.callee, IS_UNDEFINED_OR_NULL
      
        /*
      
      
         {line} 
      
      
        */
      
      
        );
    
      
      
        if
      
      (__src.type && __src.type == "CV_RGBA"
      
        ){
        
      
      
        var
      
       width =
      
         __src.col,
            height 
      
      =
      
         __src.row,
            size 
      
      = __size || 3
      
        ,
            dst 
      
      = __dst || 
      
        new
      
      
         Mat(height, width, CV_RGBA),
            dstData 
      
      =
      
         dst.data;
        
        
      
      
        var
      
       start = size >> 1
      
        ;
        
      
      
        var
      
       withBorderMat = copyMakeBorder(__src, start, start, 0, 0
      
        , __borderType),
            mData 
      
      =
      
         withBorderMat.data,
            mWidth 
      
      =
      
         withBorderMat.col;
        
        
      
      
        var
      
      
         newOffset, total, nowX, offsetY, offsetI, nowOffset, i, j;
        
        
      
      
        if
      
      (size & 1 === 0
      
        ){
            error(arguments.callee, UNSPPORT_SIZE
      
      
        /*
      
      
         {line} 
      
      
        */
      
      
        );
            
      
      
        return
      
      
         __src;
        }
        
        
      
      
        for
      
      (i = height; i--
      
        ;){
            offsetI 
      
      = i *
      
         width;
            
      
      
        for
      
      (j = width; j--
      
        ;){
                newOffset 
      
      = 0
      
        ;
                total 
      
      = 0
      
        ;
                
      
      
        for
      
      (y = size; y--
      
        ;){
                    offsetY 
      
      = (y + i) * mWidth * 4
      
        ;
                    
      
      
        for
      
      (x = size; x--
      
        ;){
                        nowX 
      
      = (x + j) * 4
      
        ;
                        nowOffset 
      
      = offsetY +
      
         nowX;
                        (mData[nowOffset] 
      
      + mData[nowOffset + 1] + mData[nowOffset + 2] > total) && (total = mData[nowOffset] + mData[nowOffset + 1] + mData[nowOffset + 2]) && (newOffset =
      
         nowOffset);
                    }
                }
                dstData[(j 
      
      + offsetI) * 4] =
      
         mData[newOffset];
                dstData[(j 
      
      + offsetI) * 4 + 1] = mData[newOffset + 1
      
        ];
                dstData[(j 
      
      + offsetI) * 4 + 2] = mData[newOffset + 2
      
        ];
                dstData[(j 
      
      + offsetI) * 4 + 3] = mData[newOffset + 3
      
        ];
            }
        }
        
    }
      
      
        else
      
      
        {
        error(arguments.callee, UNSPPORT_DATA_TYPE
      
      
        /*
      
      
         {line} 
      
      
        */
      
      
        );
    }
    
      
      
        return
      
      
         dst;
};
      
    

(mData[nowOffset] + mData[nowOffset + 1] + mData[nowOffset + 2] > total) && (total = mData[nowOffset] + mData[nowOffset + 1] + mData[nowOffset + 2]) && (newOffset = nowOffset);

這行代碼里面,我們先用RGB的數值和與上一個最大值total對比,然后如果新的值比較大,就把新的值賦給total,并把新的偏移量newOffset賦值當前偏移量nowOffset。

然后整個內核大小的面積循環完了就可以找到一個最大的total以及對應的偏移量newOffset。就可以賦值了:

dstData[(j + offsetI) * 4] = mData[newOffset];
dstData[(j + offsetI) * 4 + 1] = mData[newOffset + 1];
dstData[(j + offsetI) * 4 + 2] = mData[newOffset + 2];
dstData[(j + offsetI) * 4 + 3] = mData[newOffset + 3];

那么腐蝕erode函數則相反,找一個最小的值就行了。

      
        var
      
       erode = 
      
        function
      
      
        (__src, __size, __borderType, __dst){
    __src 
      
      || error(arguments.callee, IS_UNDEFINED_OR_NULL
      
        /*
      
      
         {line} 
      
      
        */
      
      
        );
    
      
      
        if
      
      (__src.type && __src.type == "CV_RGBA"
      
        ){
        
      
      
        var
      
       width =
      
         __src.col,
            height 
      
      =
      
         __src.row,
            size 
      
      = __size || 3
      
        ,
            dst 
      
      = __dst || 
      
        new
      
      
         Mat(height, width, CV_RGBA),
            dstData 
      
      =
      
         dst.data;
        
        
      
      
        var
      
       start = size >> 1
      
        ;
        
      
      
        var
      
       withBorderMat = copyMakeBorder(__src, start, start, 0, 0
      
        , __borderType),
            mData 
      
      =
      
         withBorderMat.data,
            mWidth 
      
      =
      
         withBorderMat.col;
        
        
      
      
        var
      
      
         newOffset, total, nowX, offsetY, offsetI, nowOffset, i, j;
        
        
      
      
        if
      
      (size & 1 === 0
      
        ){
            error(arguments.callee, UNSPPORT_SIZE
      
      
        /*
      
      
         {line} 
      
      
        */
      
      
        );
            
      
      
        return
      
      
         __src;
        }
        
        
      
      
        for
      
      (i = height; i--
      
        ;){
            offsetI 
      
      = i *
      
         width;
            
      
      
        for
      
      (j = width; j--
      
        ;){
                newOffset 
      
      = 0
      
        ;
                total 
      
      = 765
      
        ;
                
      
      
        for
      
      (y = size; y--
      
        ;){
                    offsetY 
      
      = (y + i) * mWidth * 4
      
        ;
                    
      
      
        for
      
      (x = size; x--
      
        ;){
                        nowX 
      
      = (x + j) * 4
      
        ;
                        nowOffset 
      
      = offsetY +
      
         nowX;
                        (mData[nowOffset] 
      
      + mData[nowOffset + 1] + mData[nowOffset + 2] < total) && (total = mData[nowOffset] + mData[nowOffset + 1] + mData[nowOffset + 2]) && (newOffset =
      
         nowOffset);
                    }
                }
                dstData[(j 
      
      + offsetI) * 4] =
      
         mData[newOffset];
                dstData[(j 
      
      + offsetI) * 4 + 1] = mData[newOffset + 1
      
        ];
                dstData[(j 
      
      + offsetI) * 4 + 2] = mData[newOffset + 2
      
        ];
                dstData[(j 
      
      + offsetI) * 4 + 3] = mData[newOffset + 3
      
        ];
            }
        }
        
    }
      
      
        else
      
      
        {
        error(arguments.callee, UNSPPORT_DATA_TYPE
      
      
        /*
      
      
         {line} 
      
      
        */
      
      
        );
    }
    
      
      
        return
      
      
         dst;
};
      
    

?

效果

Javascript圖像處理——圖像形態學_第2張圖片

Javascript圖像處理——圖像形態學_第3張圖片

?

系列目錄

Javascript圖像處理系列

?

? 參考資料

Eroding and Dilating

Javascript圖像處理——圖像形態學


更多文章、技術交流、商務合作、聯系博主

微信掃碼或搜索:z360901061

微信掃一掃加我為好友

QQ號聯系: 360901061

您的支持是博主寫作最大的動力,如果您喜歡我的文章,感覺我的文章對您有幫助,請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧,狠狠點擊下面給點支持吧,站長非常感激您!手機微信長按不能支付解決辦法:請將微信支付二維碼保存到相冊,切換到微信,然后點擊微信右上角掃一掃功能,選擇支付二維碼完成支付。

【本文對您有幫助就好】

您的支持是博主寫作最大的動力,如果您喜歡我的文章,感覺我的文章對您有幫助,請用微信掃描上面二維碼支持博主2元、5元、10元、自定義金額等您想捐的金額吧,站長會非常 感謝您的哦!!!

發表我的評論
最新評論 總共0條評論
主站蜘蛛池模板: a国产成人免费视频 | 青青久久99久久99久久999 | 成人毛片网站 | 国产毛片哪里有 | 欧美深夜影院 | 亚洲成a人片在线观看精品 亚洲成a人一区二区三区 | 久久亚洲精品永久网站 | 久久精品爱 | 97精品国产91久久久久久 | 草的爽免费视频 | 日本免费在线一区 | 日本亚洲a | 久草视频精品在线 | 欧美日韩一区二区不卡三区 | 四虎免费视频 | 一区二区三区日韩精品 | 日本特黄特色aaa大片免费 | 亚洲免费在线观看视频 | 亚洲精品国产精品一区二区 | 亚洲成人在线播放视频 | 妇女网站爱嘿嘿视频免费观看 | 夜夜爽夜夜操 | 亚洲图欧美色综合图 | 亚洲国产成人久久精品影视 | 久久久久日韩精品无 | 天天操天天看 | 老子影院午夜伦手机不卡6080 | 91国内在线国内在线播放 | www激情五月| 久久综合久久综合九色 | 奇米影视777中文久久爱 | 亚洲最大成人网 色香蕉 | 欧美综合影院 | 久久久久草| 四虎永久在线精品视频播放 | 四虎播放| 97在线观看免费视频 | 四虎影视永久在线精品免费 | 久热免费 | 一区二区三区在线 | 久久国产精品一区二区三区 |