前回はWebARでGPS指定位置にモデルを出現させるということで、弊社所在地の隼ラボのグランドにロケットを飛ばしました。
今回は、隼ラボにある50メートルプールの壁がウォールアートで華やかになったので、このイラストの一部分をWebARで認識し、その場所に3Dモデルを表示するテストです。
以前から、専用のマーカー（QRコードのようなもの）を認識して、そこにモデル表示できるものはありますが、今回は普通の画像を認識してモデル表示します。
参考サイト。
https://aframe.io/blog/arjs3/
サンプルプログラムはほぼ参考サイトのままです。
どの画像を認識したら3Dモデルを表示させるかは、画像の特徴点を抽出して専用のファイルに変換する必要があります。
それを無料でオンラインで処理してもらえるサイトがこちらです。
https://carnaux.github.io/NFT-Marker-Creator/
画像サイズが大きすぎると処理に時間がかかるらしいので、長辺 1000px程度までがよいようです。
特徴点の抽出が完了すると、3つのファイルがダウンロードできます。
それらを１つのディレクトリに格納し、サンプルプログラムと同じサーバーにアップロードします。
そして、サンプルプログラム中にある <path-to-your-image-descriptors> の場所に、ディレクトリのパスを書きます。（ファイルのパスではありません）
そうすると、簡単にAR表示できました。
今回は、「うさぎ」のイラストをを認識して、そこに3Dモデルを表示しました。
うさぎのイラスト部分のみでは特徴点が抽出できなかったため、周囲も撮影した写真を利用して特徴点を抽出しています。