そういえば、A-Frame v1.1.0でdom-overlayとhit-testの実装が入りました。

Blogにメモにしようと思っていて忘れていました。

去年の12月ですがA-Frame v1.1.0がリリースされました。

このバージョンから、Dom-overlayとhit-testの実装が入っています。

他にも、hand-trackingもありますが、今の所は動作環境はQuest2限定ぽいです。

WebXR Device API自体にはA-Frame v1.0.0から対応していたのですが、

本格的にインタラクション可能となる実装が入るのは今回からとなります。

今回追加された、Dom-overlayとhit-testについて簡単に紹介します。

ブラウザ上でAR/VRを実現する技術で、WebXR Device APIを利用し、精度の高いトラッキングを実現しています。

Mozillaさんのサイトに日本語でまとまっていますね。

A-Frameでの具体的な実装方法は、ドキュメントを参照しましょう。

WebXR Device API自体がまだDraftなのでAndroid Chromeしか動作しません。

A-Frame v1.0.0でWebXRでARモードの場合は、DOM表示できませんでした。それが、v1.1.0でDom-overlayが導入されたことにより、ARモードにもDOM表記できるようになります。

これで、ボタンやSelectorなど、一般的な2D部品を表示して操作することができます。

現実空間の平面などを認識することができ、その位置に3Dモデルを配置するなど、現実とリンクしたXR体験を行うことができます。

VR空間におけるRaycasterと同様に現実のものとRayがぶつかった箇所を認識できます。

それぞれのA-Frameにおける実装方法はまた別の記事で。