複数の写真から3次元モデルを作成することができる【3Dガウシアンスプラッティング】で、福井市足羽神社のしだれ桜を作成しました。
江戸時代から福井市(当時は福井藩)の人々の春を楽しませてきた、樹齢およそ380年の大きなしだれ桜。その長い歴史の一瞬を立体化して残しました(撮影は2024年)。
3種類の方法で3DガウシアンスプラッティングをWebで表示
フォトグラメトリーで作成したモリゴンモデルや3DガウシアンスプラッティングをWebで公開する方法はいろいろありますが、今回は「Babylon.js」「SuperSplat」「ARRIVAL.SPACE」の3つのサービスを使用してみました。
Babylon.js で3Dガウシアンスプラッティングを表示
1つ目は Babylon.js を使う方法です。
(画像をクリックすると別ページで表示されます)

しだれ桜の周囲はクロップしてあります。
これはモデルの周囲をカメラが回転してどの角度からも見られる標準的なモデルビューワーとしてスクリプトを設定しています。
Babylon.js ではモデルの周囲を歩いて眺めるような表現もできます。
SuperSplat で3Dガウシアンスプラッティングを表示
2つ目は SuperSplat を使う方法です。
(画像をクリックすると別ページで表示されます)

しだれ桜の周囲も含めて3Dガウシアンスプラッティングを作成しているので、超広角視野の設定にしてあります。
SuperSplat はモデルの周囲をカメラが回転してどの角度からも見られるモデルビューワー表示のみですが、不要なスプラットの削除やクロップ、plyファイルの圧縮などビューワー以外の機能もとても便利です。
iframe を使った埋め込み用の形式をエクスポートできるのも特徴です。
ARRIVAL.SPACE で3Dガウシアンスプラッティングを表示
3つ目は ARRIVAL.SPACE を使う方法です。
(画像をクリックすると別ページで表示されます)

ARRIVAL.SPACE は3Dガウシアンスプラッティングやポリゴンモデルを複数展示できる個人のスペースを設置し、そこを訪れた人が自由に見ることができるWebサービスです。
ARRIVAL.SPACE の一番の特徴は、モデルの周囲や内部をアバターが自由に歩き回れるような見せ方ができることです。実際にその場所にいるような感覚を手軽に体験することができます。
歩き回れるような表現は、Babylon.js や PlayCanvas でも可能ですが、ノースクリプトでコリジョン付きの3Dガウシアンスプラッティングを表示できるのはとても便利です(コリジョンを設定するには有料プランが必要)。
まとめ
フォトグラメトリーはスマホでも手軽に作成でき、スマホやPCの中で眺めるのは比較的簡単です。
しかしそれをWebで公開したり、他の表現に利用したりしようとすると、目的や内容やコストなどによってサービスを使い分ける必要があります。
モバイル環境でストレスなく表示や操作を行えるようにするのも簡単ではありません。
いろいろな技術やサービスを使い分けながら、フォトグラメトリーや3Dガウシアンスプラッティングを利用する方法をこれからもご紹介していきます。
最後に、このしだれ桜の3Dガウシアンスプラッティングを使ったサンプル映像をAfter Effectsで作成しているので御覧ください。
(画像をクリックすると別ページで表示されます)

コメント