@ma2yama/opencv-js

OpenCV を WebAssembly (WASM) 向けにビルドしたブラウザ・Node.js 向けパッケージです。WASM バイナリは JS ファイルに埋め込まれているため、.wasm ファイルの別途配置は不要です。

インストール

npm install @ma2yama/opencv-js

使い方

cv はそのまま Promise として export されています。await で解決すると OpenCV オブジェクトが得られます。

ブラウザ (スクリプトタグ)

<script src="node_modules/@ma2yama/opencv-js/bin/opencv.js"></script>
<script type="module">
  const openCV = await cv;
  const mat = new openCV.Mat(100, 100, openCV.CV_8UC4);
  console.log(mat.rows); // 100
  mat.delete();
</script>

TypeScript (Vite / バンドラー非推奨)

opencv.js は約 11MB あるため、バンドラーに通さず <script src> で直接ロードすることを推奨します。

import type cvPromise from '@ma2yama/opencv-js';

type OpenCV = Awaited<typeof cvPromise>;

declare global {
  const cv: typeof cvPromise; // Promise<OpenCV>
}

const openCV: OpenCV = await cv;
const mat = new openCV.Mat(100, 100, openCV.CV_8UC4);
console.log(mat.rows); // 100
mat.delete();

Node.js

import { createRequire } from 'module';
const require = createRequire(import.meta.url);

const cv = await require('@ma2yama/opencv-js');
const mat = new cv.Mat(100, 100, cv.CV_8UC4);
console.log(mat.rows); // 100
mat.delete();

重要: メモリ管理

OpenCV.js は C++ ヒープメモリを使用します。Mat などの OpenCV オブジェクトを使い終わったら必ず .delete() を呼び出してください。

const mat = new cv.Mat();
// ... 処理 ...
mat.delete(); // 必須

利用可能なモジュール

| モジュール | 主な API | |-----------|---------| | core | Mat, 算術演算, ビット演算 など | | imgproc | cvtColor, GaussianBlur, Canny, goodFeaturesToTrack など | | objdetect | CascadeClassifier | | features2d | ORB, BFMatcher など |

NPM への公開

ログイン

npm login

公開

cd packages/opencv-js
npm publish

バージョン更新

npm version patch   # パッチバージョンを上げる (例: 4.12.0 → 4.12.1)
npm version minor   # マイナーバージョンを上げる (例: 4.12.0 → 4.13.0)
npm version major   # メジャーバージョンを上げる (例: 4.12.0 → 5.0.0)

バージョンを更新してから npm publish を実行してください。

ライセンス

Apache-2.0 — 詳細は LICENSE を参照してください。

型定義は @techstark/opencv-js (Apache-2.0) を元にしています。