WebXR - ブラウザでAR

1. はじめに

ARをやって見たくて色々調べていたところ、WebXRで簡単にブラウザでARの実装ができそうなので、試してみた。

GitHub - yhikishima/WebXR-dev: WebXR Test Development Project

↑試してみた自身のGithubプロジェクト

WebXR Dev - Sample

↑実際にgithubIOにあげたプロジェクト

2. 準備

GitHub - immersive-web/webxr-samples: Samples to demonstrate use of the WebXR Device API

↑サンプルプロジェクトから必要なファイルを持ってくる。今回はARだけ試してみたいので、immersive-ar-session.htmlを持ってくる。

css js media

上記もそのまま持ってくる。

3. 確認

どのような方法でも良いのでスマホのブラウザで確認してみる。

Web AR

成功。

一旦動くところまで確認したかったので、最短で試してみた。 あとはプロジェクトをいじいじして何ができるか試してみようと思う。

参考

ウェブブラウザでXRを身近にするWebXRとは？. WebXRとはウェブブラウザ上でXRを可能にするため、W3Cが2018年にImm… | by Hiroyuki Makino | nttlabs | Medium

GitHub - immersive-web/webxr-samples: Samples to demonstrate use of the WebXR Device API

WebXR - Samples

WebXR Device APIを使う | 第1回 ARを実装する | CodeGrid

WebXR Device API - Web API | MDN