>  기사  >  웹 프론트엔드  >  Javascript 이미지 처리 - 이미지 형태(확장 및 침식)_javascript 기술

Javascript 이미지 처리 - 이미지 형태(확장 및 침식)_javascript 기술

WBOY
WBOY원래의
2016-05-16 17:44:361869검색
머리말

이전 글에서는 영상 처리에서의 임계값 함수에 대해 설명했습니다. 이번 글에서는 확장 및 부식 함수에 대해 설명하겠습니다.

팽창과 부식

콘셉트를 설명하기 어려울 수 있습니다. 먼저 사진을 살펴보겠습니다.

Original image

확장하면 다음과 같습니다.

Dilation result - Theory example

부식 후의 모습은 다음과 같습니다.

Erosion result - Theory example

좀 의아해 보일 수도 있는데 확장인 건 당연하고, 부식인 건 당연하고, 왜 단어가 두꺼워지는 걸까요?

실제로 소위 확장은 을 참고해야 합니다:

더 밝은 색상 블록이 확장됩니다.

소위 부식은 을 참조해야 합니다.

밝은 색상의 블록은 부식됩니다.

위 사진에서 흰색 배경은 연한 컬러 블록이라 팽창하면 어두운 검정색 블록의 글자가 납작해집니다... 반대로 부식되면 글자가 물을 흡수하여 팽창합니다.. .

를 수학식으로 표현하면 :

직접 말하면 지정된 크기의 커널에서 가장 어둡거나 가장 밝은 픽셀을 찾아 커널 앵커 포인트의 픽셀을 이 지점으로 바꾸는 것입니다.

달성

먼저 확장 확장 기능을 구현합니다.

코드 복사 코드는 다음과 같습니다.

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,

if(size & 1 === 0){
error(arguments .callee, UNSPPORT_SIZE/* {line} */);
return __src;
}

for(i = height; i--;){
offsetI = i * 너비;
for(j = 너비; j--;){
newOffset = 0;
total = 0;
for(y = 크기; y--;){
offsetY = (y i) * mWidth * 4;
for(x = size; x--;){
nowX = (x j) * 4
nowOffset = offsetY nowX; 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( 인수.callee , UNSPPORT_DATA_TYPE/* {line} */);
}
return dst;
};

이 코드 줄에서는 먼저 RGB 값을 사용합니다. 과 이전의 최대값 total을 비교한 후 새 값이 더 크면 total에 새 값을 할당하고 현재 offset nowOffset에 새 오프셋 newOffset을 할당합니다.
그러면 전체 커널 크기 영역이 순환된 후 최대 합계와 해당 오프셋 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];

그러면 침식 함수는 반대가 됩니다. 가장 작은 값을 찾으면 됩니다.


코드 복사 코드는 다음과 같습니다.

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(높이, 너비, CV_RGBA),
dstData = dst.data;

var start = 크기 >> 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} */);
__src를 반환합니다.
}

for(i = 높이; i--;){
offsetI = i * 너비;
for(j = 너비; j--;){
newOffset = 0;
총계 = 765;
for(y = 크기; y--;){
offsetY = (y i) * mWidth * 4;
for(x = 크기; 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} */);
}
dst를 반환합니다.
};

效果

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.