opencv.jsの作法 その2

# 概要

opencv.jsの作法を調べてみた。

# 実行環境

sandboxを用意した。以下のコードは動く。
https://s.codepen.io/ohisama/debug/VgVgQV/bYAdyeDvYGYk

# affineで、平行移動

- 斜め

```javascript
	let src = cv.imread('canvasInput');
	let dst = new cv.Mat();
	let v = 100;
	let srcTri = cv.matFromArray(3, 1, cv.CV_32FC2, [0, 0, 0, 1, 1, 0]);
	let dstTri = cv.matFromArray(3, 1, cv.CV_32FC2, [v, v, v, v + 1, v + 1, v]);
	let dsize = new cv.Size(src.rows, src.cols);
	let M = cv.getAffineTransform(srcTri, dstTri);
	cv.warpAffine(src, dst, M, dsize, cv.INTER_LINEAR, cv.BORDER_CONSTANT, new cv.Scalar());
	cv.imshow('canvasOutput', dst);
	src.delete();
	dst.delete();
	M.delete();
	srcTri.delete();
	dstTri.delete();
```

- 上下

```javascript
	let src = cv.imread('canvasInput');
	let dst = new cv.Mat();
	let v = 100;
	let srcTri = cv.matFromArray(3, 1, cv.CV_32FC2, [0, 0, 0, 1, 1, 0]);
	let dstTri = cv.matFromArray(3, 1, cv.CV_32FC2, [v, 0, v, 1, v + 1, 0]);
	let dsize = new cv.Size(src.rows, src.cols);
	let M = cv.getAffineTransform(srcTri, dstTri);
	cv.warpAffine(src, dst, M, dsize, cv.INTER_LINEAR, cv.BORDER_CONSTANT, new cv.Scalar());
	cv.imshow('canvasOutput', dst);
	src.delete();
	dst.delete();
	M.delete();
	srcTri.delete();
	dstTri.delete();
```

- 左右

```javascript
	let src = cv.imread('canvasInput');
	let dst = new cv.Mat();
	let v = 100;
	let srcTri = cv.matFromArray(3, 1, cv.CV_32FC2, [0, 0, 0, 1, 1, 0]);
	let dstTri = cv.matFromArray(3, 1, cv.CV_32FC2, [0, v, 0, v + 1, 1, 0]);
	let dsize = new cv.Size(src.rows, src.cols);
	let M = cv.getAffineTransform(srcTri, dstTri);
	cv.warpAffine(src, dst, M, dsize, cv.INTER_LINEAR, cv.BORDER_CONSTANT, new cv.Scalar());
	cv.imshow('canvasOutput', dst);
	src.delete();
	dst.delete();
	M.delete();
	srcTri.delete();
	dstTri.delete();
```

# affineで、拡大、縮小

- 拡大

```javascript
	let src = cv.imread('canvasInput');
	let dst = new cv.Mat();
	let v = 0.1;
	let srcTri = cv.matFromArray(3, 1, cv.CV_32FC2, [0, 0, 0, 1, 1, 0]);
	let dstTri = cv.matFromArray(3, 1, cv.CV_32FC2, [0, 0, 0, v + 1, v + 1, 0]);
	let dsize = new cv.Size(src.rows, src.cols);
	let M = cv.getAffineTransform(srcTri, dstTri);
	cv.warpAffine(src, dst, M, dsize, cv.INTER_LINEAR, cv.BORDER_CONSTANT, new cv.Scalar());
	cv.imshow('canvasOutput', dst);
	src.delete();
	dst.delete();
	M.delete();
	srcTri.delete();
	dstTri.delete();
```

- 縮小

```javascript
	let src = cv.imread('canvasInput');
	let dst = new cv.Mat();
	let v = -0.1;
	let srcTri = cv.matFromArray(3, 1, cv.CV_32FC2, [0, 0, 0, 1, 1, 0]);
	let dstTri = cv.matFromArray(3, 1, cv.CV_32FC2, [0, 0, 0, v + 1, v + 1, 0]);
	let dsize = new cv.Size(src.rows, src.cols);
	let M = cv.getAffineTransform(srcTri, dstTri);
	cv.warpAffine(src, dst, M, dsize, cv.INTER_LINEAR, cv.BORDER_CONSTANT, new cv.Scalar());
	cv.imshow('canvasOutput', dst);
	src.delete();
	dst.delete();
	M.delete();
	srcTri.delete();
	dstTri.delete();
```

# affineで、回転


```javascript
	let src = cv.imread('canvasInput');
	let dst = new cv.Mat();
	let v = 0.5;
	let srcTri = cv.matFromArray(3, 1, cv.CV_32FC2, [0, 0, 0, 1, 1, 0]);
	let dstTri = cv.matFromArray(3, 1, cv.CV_32FC2, [0, 0, Math.sin(v), Math.cos(v), Math.cos(v), -Math.sin(v)]);
	let dsize = new cv.Size(src.rows, src.cols);
	let M = cv.getAffineTransform(srcTri, dstTri);
	cv.warpAffine(src, dst, M, dsize, cv.INTER_LINEAR, cv.BORDER_CONSTANT, new cv.Scalar());
	cv.imshow('canvasOutput', dst);
	src.delete();
	dst.delete();
	M.delete();
	srcTri.delete();
	dstTri.delete();
```

以上