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

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毛片日本 | 华人欧美国产在线精品 | 天天拍拍天天爽免费视频 | 国产呦系列呦交 | www国产永久免费视频看看 | 亚洲欧美精品国产一区色综合 | 免费a级网站 | 国产美女白丝袜精品_a不卡 | 免费看a网站 | 国产在线视频福利 | 日韩天天干 | 国产成人精品男人免费 | 奇米视频第四色 | 久久精品视频网 | 97se亚洲国产综合自在线观看 | 国产成人精品在线观看 | 亚洲视屏在线 | 久久这里只有 | 99一级毛片 | 欧美seav在线 | 色就操| 91精品国产一区二区三区左线 | 爱爱视频欧美 | 99热久久久久久久免费观看 | 国产成人啪午夜精品网站 | 黄色网址在线免费 | 亚洲情综合五月天 | 99久久久国产精品免费牛牛四川 | 日本xxxxx18护士xxx | 国产三级久久久精品麻豆三级 | 国产美女久久 | 欧美日韩91 | 欧美a毛片 | 久re这里只有精品最新地址 | 天天干夜夜曰 | 福利在线网 | 乱码一区二区三区完整视频 | 另类最猛性xxxxx | 特级黄一级播放 | 欧美亚洲网站 | 久久久久在线观看 |