(僕)待望の太宰治企画
![ARで_page-0001.jpg](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F281755%2Fb6839990-c829-6452-88b7-16bd9e1c19d8.jpeg?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=1982e0c0a0560370341e57639b01bdf6)
AR.jsに触れて、すぐにこれを実現したいと思った。
太宰治を墓から蘇らせてツーショットを撮るのだ。なんなら妻の津島美知子と森鴎外も墓から出現させて4人で撮影をしたい。
なぜつくりたいのか
三鷹の禅林寺に太宰治の墓がある。6月19日は太宰治の命日で、全国から熱心な太宰ファンが墓参りに訪れる。僕もそのうちの一人だった。
この墓の凄いところは、太宰と妻の墓の向かいに、森鴎外の墓もあることだ。禅林寺に訪れると、時空を超えて(とはいえ100年やそこらなのだが)彼らと空間を共にしているような不思議な感覚を味わうことができる。
ちょっと説明が難しいんだけれど、この空間を共にしている感覚を、もっと明瞭なものにしたいと思った。それが「太宰と森鴎外と一緒に写真撮影する」という企画を立てた動機だ
実現方法の検討
![太宰治説明2.jpg](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F281755%2Fcb73fccf-2c61-2563-c8d9-4c0daaf62a4c.jpeg?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=7cf6b4b1316273e6c0e36c5865417774)
◯厳密なやり方
①太宰治の墓をカメラで読み込むと
②墓の上部に太宰治の3Dモデルが出現する
こちらが最もテンションが上がる、厳密な再現方法だ。しかし実現すにはちょっとハードルが高い。
なので、実装可能そうな状態まで機能を簡略化した。これが僕の夢を実現するためのStep1となる。
◯Step1
①太宰の墓がある墓地の大まかな位置に
②太宰の静止画を表示させる
実装手段
①について
AR.jsのLocation Based ARをA-Fremeを使って実装する。
緯度・経度を指定することで、若干の誤差(10m程度)はあるが、大まかな位置にオブジェクトを表示することができる。
実装はA-Frameのドキュメントを参考にした。
②について:
こちらの画像を、AR.js内でイメージとして指定し表示する
なお、作成したWEBアプリはNetlifyにデプロイして試験を行った。
実装するものの
結論から言うと、①②共に意図通りの動作をしておらず、現状まだ解決していない。
①について:
まずは、緯度・経度を指定して立方体のブジェクトの表示を試みた。
See the Pen Soseki_distanceBox by よしだじゅんや (@atoms50) on CodePen.
結果は、スマホのカメラをかざしてもオブジェクトは表示されない。
こちらのサイトに、建造物が多かったり、GPSが取得しづらい場所はうまく表示されないことがあるという記述があった。
建造物が少ない広い場所(墓地)で試してみたが、やはり表示はされなかった。
このことからGPS取得の要因ではなく、おそらくソースコード側の要因だと考えられる。一方で、エラーの根本原因は分からない状況である。
②について:
AR.jsでそもそもオブジェクトを表示できないため、同じくA-Frameを使って3D空間上に写真を表示できるか試みた。(うまくいったら3D空間に禅林寺を再現してもいいなという狙いもあった)
が、こちらもうまく表示されなかった
See the Pen 太宰治 by よしだじゅんや (@atoms50) on CodePen.
今後について
①②の問題を早急に解決して、Step1までは実現したいところである。
最後に墓場でコーディングしている際の様子を共有する。
これで成果が出なかった時本当に精神が崩壊しそうだった。