これは「Babylon.js アドベントカレンダー2024」の9日目です。
前回の私の記事では、Babylon Toolkitの概要や環境構築方法を書きました。
今回はUnityを開いてからの初期設定や、CubeとPlaneを置いたシーンをエクスポートしてブラウザで確認するまでの手順を紹介します。
なお、今回書いた内容は公式？が公開している動画で紹介されている内容と同一です。 13:49までの動画のうち、9:30から終わりまでの内容です。
前提として、前回の記事の内容が完了した状態から始めます。
ここでは、Y軸周りに回転する処理を書いたスクリプトを作り、Cubeを回転させる方法を紹介します。
動作確認環境
Unity2022.3.34f1
Babylon Toolkit 7.28.1 (Community Edition)
1. スクリプトファイルを生成する
Project Viewで右クリック、Create > Babylon Toolkit > Script Componentを実行します。
すると、C#とTSの２つのスクリプトが生成されます。C#側でMyRotate.csという名前に変更するとTS側も自動的に変更されます。
2. TS側にTypeScriptで処理を書いていく
ちょっと予想と異なったのですが、今調べている範囲ではC#で直接処理を書くのではなく、新しく生成された.tsファイルの中にTypeScriptとして処理を書く必要がありそうです。
たとえば、今回紹介するCubeの回転については、MyRotate.cs側は特に何も書くことはなく、同時に生成されたMyRotate.tsに記載します。
Start(), Update()はUnityと似た形ですが、回転処理であるtransform.addRotationは、UnityではなくBabylon.jsのAPIです。
3. C#スクリプトファイルをUnityのCubeオブジェクトにアタッチする
MyRotate.csをCubeにアタッチします。この状態でPlayボタンを押してBuild -> Previewを実行すると、ブラウザでこのような挙動を確認できます。
4. おわりに
もう少し調査が必要な気はしますが、Babylon Toolkitのコンセプトは「Unityの環境でBabylon.jsを使う」であり、C#で書くものは対象外としているようです。C#で書いた記述が混じると、TypeScriptで書いた内容は動かなくなりました。
そうすると、この仕組みはUnityユーザ向けというよりは、Babylon.jsユーザがUnity環境を使うための仕組みと考えた方がよいかもしれません。
実は６年前にも同様のtoolkitが公開されており、そのときは「Unityで作った内容をBabylon.jsの形にExportする」というものでした。
toolkitそのものは、すでにリンク切れになっていましたが、当時の検証結果はこちらです。
Documentationには他にもいくつかの機能が紹介されていますが、今回の調査はここまでにしたいと思います。
次回は少し別のトピックを紹介予定です。
