Javascript 이미지 처리 - matrices_javascript 기술에 일반적인 방법 추가

머리말
이전 기사에서는 행렬을 정의했습니다. 이번 기사에서는 행렬에 몇 가지 일반적인 방법을 추가하겠습니다.

toString 메소드
toString 메소드는 일반적으로 객체를 문자열 설명으로 변환하는 데 사용되므로 이 메소드를 출력 행렬 요소로 정의합니다.

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

Mat.prototype.toString = function() {
var tempData = this.data,
text = "Mat(" this.type ") = {n",
num = this.col *
for(var i = 0; i text = "["
for(var j = 0; j text = (tempData[i * num j] ",");
text = "]n"
text = "}"
return text; >
이런 식으로 다음을 전달할 수 있습니다.

코드 복사

코드는 다음과 같습니다. console.log( mat)

매트릭스를 출력합니다.

clone 메소드

실제로 생성자를 통해서도 cloning 작업을 수행할 수 있지만, 여전히 메모리와 사용을 용이하게 하는 메소드를 제공합니다.


코드 복사

코드는 다음과 같습니다. Mat.prototype.clone = function() { return new Mat(this.row, this.col, this.data) };

지정된 요소 가져오기

그것을 얻는 두 가지 방법 Matrix 요소.

배열 방식
Mat는 실제로 배열 형태로 데이터를 저장하기 때문에 데이터는 다음과 같습니다.
R00 G00 B00 A00 R01 G01 B01 A01… B0n A0n
R10 G10 B10 A10 R11 G11 B11 A11 … R1n G1n B1n A1n …… Rm0 Gm0 Bm0 Am0 Rm1 Gm1 Bm1 Am1 … B, A는 각각 각 채널의 값을 나타내며, 첫 번째 첨자는 행 번호, 두 번째 첨자는 열 번호를 나타냅니다. 즉, k행과 j열의 G 채널 값은 Gkj이다.
Mat 유형 매트의 경우 k번째 행과 j번째 열 픽셀의 각 요소는 다음과 같습니다.
Rkj = mat.data[(k * mat.col j) * 4 0 ]
Gkj = mat.data[(k * mat.col j) * 4 1]
Bkj = mat.data[(k * mat.col j) * 4 2]
Akj = mat . data[(k * mat.col j) * 4 3]


버퍼 부분 참조 방법

버퍼의 부분 참조를 통해 행렬의 부분 참조를 얻을 수 있으며, 이를 사용하여 픽셀 데이터 배열을 얻을 수 있으며, 이 배열의 값을 변경하면 해당 행렬 데이터도 변경됩니다. 다른 예에서는 다른 데이터 유형의 데이터를 읽을 수 있습니다. 이는 일반 배열로는 달성할 수 없습니다. at 메소드의 구현을 살펴보겠습니다:


코드 복사

코드는 다음과 같습니다. Mat.prototype.at = function(__type, __x, __y){ var type = __type, x = __x || 0, y = __y || 0,

rowLen = this.col * this.channel * this.bytes,

len = 1
if(type.indexOf("Vec") > -1){
var temp = __type.match(/ Vec(d )( [a-z])/);
len = parsInt(temp[1])
switch(temp[2]){
case "b":
type = " uchar";
break;
case "s":
type = "short";
break;
case "i":
type = "int";
break;
case "f":
type = "float";
case "d":
type = "double"
}
}
switch(type){
case "uchar":
return new Uint8Array(this.buffer, (y * rowLen x), len)
break
case; "short":
return new Int16Array(this.buffer, (y * rowLen x * 2), len)
break
case "int":
return new Int32Array(this.buffer , (y * rowLen x * 4), len);
break;
case "float":
return new Float32Array(this.buffer, (y * rowLen x * 4), len); 🎜>break;
case "double":
return new Float64Array(this.buffer, (y * rowLen x 8), len)
break;
console. error("지원되지 않는 데이터 유형");
}
};
ArrayBuffer 및 TypedArray에 대해 명확하지 않은 경우 HTML5의 새로운 배열을 참조하세요.
문자열 유형 - 반환할 데이터 유형입니다. 지원:
uchar 부호 없는 8비트 정수
짧은 부호 있는 16비트 정수
int 부호 있는 32비트 정수
부동 부호 있는 32비트 부동 소수점
이중 부호 있는 64비트 부동 소수점 숫자

Vec 벡터 형식
벡터 형식 문자열의 철자는 Vec(유형)(숫자)입니다. 예를 들어 Vecb4는 부호 없는 8비트 정수 4개가 일반적입니다. 예를 들어 mat의 j행과 k열의 픽셀 데이터를 얻으려면 다음을 사용하세요.

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

mat.at("Vecb4", j, k)

int x - 행 수 얻을 요소의 매트릭스에서.
int y - 얻을 요소의 행렬에 있는 열 수입니다.

getRow 메소드 및 getCol 메소드
at의 구현 메소드와 유사하게 특정 행이나 열을 가져오는 메소드를 쉽게 작성할 수 있습니다.

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

Mat.prototype.getRow = function(__i){
var len = this.col * this.channel,
rowLen = len * this.bytes,
i = __i || 0
return new this.data.constructor(this.buffer, i * rowLen, len) ;
};

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

Mat.prototype .getCol = function(__i){
var len = this.col * this.channel,
rowLen = len * this.bytes,
array = [],
i = __i || 0 ;
function getAllElement(__constructor){
var row = this.row,
channel = this.channel
for(var j = 0; j array.push(new __constructor(this.buffer, j * rowLen i, 1 * 채널))
}
}
getAllElement(this.data.constructor); >return array;
};

rowRange 및 colRange 메서드

마찬가지로 행과 열을 지정하는 메서드도 얻을 수 있습니다.

코드 복사 코드는 다음과 같습니다. Mat.prototype.rowRange = function(__i, __j){

var len = this.col * this.channel,

rowLen = len * this.bytes,
array = [],
i = __i || 0,
j = __j || .row;
function getAllElement(__constructor){
var row = this.row;
for(var k = i; k array.push(new __constructor (this.buffer, k * rowLen, len));
}
}
getAllElement(this.data.constructor)
return array;




코드 복사

코드는 다음과 같습니다. Mat.prototype.colRange = function(__i , __j){ var len = this.col * this.channel, rowLen = len * this.bytes, array = [],

i = __i || j = __j || this.col;

function getAllElement(__constructor){
var row = this.row
channel = this.channel
for(var k = 0; k array.push (new __constructor(this.buffer, k * rowLen __i, (__j - __i 1) * 채널))
}
}
getAllElement(Float64Array);
return array;
} ;


이 네 가지 메소드는 모두 Array 배열을 반환합니다. 이 배열 ract의 행 j와 열 k의 요소를 가져오려면 다음을 사용할 수 있습니다.
direct[j][k]