パッと使いたいと思って調べたけど、幾らか方法があるのだろうか?
・OpenCVのC/C++からJavaScriptをビルドするOpenCV.js
https://docs.opencv.org/3.4/df/df7/tutorial_js_table_of_contents_setup.html
・npmのパッケージとしてOpenCV対応をしたnode-opencv
(どうも2年前に更新が終わっている模様.ただ今でもダウンロード数が多い気がする)
https://www.npmjs.com/package/opencv
前者が一応公式サポートっぽいので、とりあえずそっちをやってみる.
https://docs.opencv.org/3.4/d5/d10/tutorial_js_root.html
公式のサンプルはこちらにあるみたい(だいぶ揃っているので、基本的にこれだけやれば良さそう)
https://docs.opencv.org/3.4/d2/df0/tutorial_js_table_of_contents_imgproc.html
適当に拾ってやってみる?
多分簡単にやるには、公式の
https://docs.opencv.org/master/opencv.js
https://docs.opencv.org/3.4/opencv.js
をダウンロードしてしまえばいいのかな?
https://docs.opencv.org/master/js_face_detection_camera.html
https://docs.opencv.org/3.4/js_setup_usage.html
上記のサンプルが自分のブラウザでちゃんと動くなら、「デベロッパーツール」とかでページのソースコードを見ればアドレスを拾えると思う.
真面目にOpenCV.jsをローカルで用意する
EmscriptenでLLVMからJavaScriptへasm.jsかWebAssemblyの形で出力する?
Emscripten is an LLVM-to-JavaScript compiler. It takes LLVM bitcode – which can be generated from C/C++ using clang, and compiles that into asm.js or WebAssembly that can execute directly inside the web browsers. . Asm.js is a highly optimizable, low-level subset of JavaScript. Asm.js enables ahead-of-time compilation and optimization in JavaScript engine that provide near-to-native execution speed. WebAssembly is a new portable, size- and load-time-efficient binary format suitable for compilation to the web
OpenCV.jsのビルドからやるらしい.(https://docs.opencv.org/3.4/d4/da1/tutorial_js_setup.html)
基本的に上のページに沿ってやればできそう.
javascriptへの変換のためのコンパイラemscriptenを持ってくる
https://kripken.github.io/emscripten-site/docs/getting_started/downloads.html
で、
# Get the emsdk repo (レポジトリ取得)
git clone https://github.com/juj/emsdk.git
# Enter that directory (ディレクトリ移動
cd emsdk
# Fetch the latest version of the emsdk (not needed the first time you clone)
# 最新のemsdkを取得 (上でgit cloneしているならいらない)
git pull
# Download and install the latest SDK tools.
# 最新のSDKツールをダウンロードしてインストール
./emsdk install latest
# Make the “latest” SDK “active” for the current user. (writes ~/.emscripten file)
#現在のユーザで最新のSDKを有効にする
./emsdk activate latest
# Activate PATH and other environment variables in the current terminal
source ./emsdk_env.sh
#以下で値がでれば問題なし
echo ${EMSCRIPTEN}
他にはOSごとに必要な対応があるはず.まぁどれもインストールされているものな気がするけど,
OpenCVのレポジトリをgit clone して中のスクリプトを実行すると生成される.
ただ、asm版が欲しいかwebAssembly版が欲しいかはスクリプト実行時にオプション指定する.
以上でおわりみたい.
ビルドは意外と時間がかかっている気がする.
ビルドが終わると
build_js/binにファイルができる.
opencv.jsを取るべきなのかopencv_js.jsを取るべきなのかよくわからないけど、
できてるっぽい.
他サンプル味見
スムージングとか試してみたけど、よく動きますね.十分早いし.
https://docs.opencv.org/3.4/dd/d6a/tutorial_js_filtering.html
Template Matching は流石にちょっと遅いけど、多分Cでもそこそこ遅いだろうししょうがないのかな?
https://docs.opencv.org/3.4/d8/dd1/tutorial_js_template_matching.html
webだとサンプルが試しやすくていいっすね.