3
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

はじめに

今年行われた技術書典にてBabylonjs勉強会の一員として技術書を執筆致しました。
全8章からなる内の1章分を担当させていただきました。
内容は『第3章 ドラッグアンドドロップした3D モデルをHMD で見てみよう
』です。

noteにはどういう経緯で書くに至ったのかや展望について書いています。
今回この記事では技術的な部分のフォーカスを当てて記事を書いていきます。

全体構成

今回の構成は手元でnodeのサーバーを立てAWS lightsail経由で外部の端末からアクセスができるようにしています。

そのため書籍ではまずはnodeのサーバーを構築する点から始まっています。
といっても最近のローカルサーバーの構築は比較的単純なため数分で完了します。
そこから外部にデータを公開するためにAWSでの機能を利用します。

Babylonjs側の話として今回のプロダクトはBabylonjsのloaderとviewerが肝となります。
これらは公式から提供されておりドラッグアンドドロップで3Dモデルが表示されるようになっています。

また既にリンクも存在しているのでそこからでも利用することができます。

モデルをドラックアンドドロップしてみるだけならこれで問題はありません。

ただ今回はドラックアンドドロップしたモデルをHMDを被りVRモードで3Dモデルを見ることができることを目指しました。
そのためviewerの機能とloaderの機能の理解が必要不可欠でした。
それぞれモデルを見るための機能とモデルをロードするための機能となります。

この2つをローカルにダウンロードしscriptタグを使って呼び出し作成していきます。

image.png

より詳しい話について知りたい方はぜひ技術書をお買い求めください。

終わりに

技術書は以下のサイトから購入することができます。
電子版のみの販売となっているので通勤時間やちょっとしたお時間に読んでみて下さい。

ここまで読んでいただきありがとうございました。

3
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?