JS で AR

Posted :

WebGL フォーラムのバレンタインデー企画でAR ぽい example を作ったのですが載せるのを忘れていたので。

WebCam と WebGL が使える環境でお楽しみいただけます。

Chocolate For You!

利用したライブラリーは

  • three.js
  • js-aruco 一式
    • aruco.js
    • cv.js
    • svd.js
    • posit1.js

とその他です。

js-aruco を始めとする、JS の CV 及び、AR 関連のライブラリーは数年前からあるので、あまり新しいことではありません。

js-aruco では、認識できるマーカーは次のいずれかのパターンを行に持つ 5 x 5 の正方形を認識します。

  • white - black - black - black - black
  • white - black - white - white - white
  • black - white - black - black - white
  • black - white - white - white - black

つまり、1024 通りを認識してくれます。three.js 用の変換行列を取得するヘルパーライブラリーとして、

  • svd.js
  • posit1.js

を使います。