Google Sketchup を使用して 3D モデルの設計を完了しました。モデルにはシーンと動的な動きが含まれています。つまり、モデルはユーザーが行ったクリックに応答します (モデルをクリックすると、モデルが移動または何かを実行します)。私のモデルをthree.jsに変換しますか?それはまだユーザーとやり取りしていますか?それとも1つのエンティティとして表示されますか(クリックには反応しません)。長い間、この件に関して助けを求めています。それを行う方法があれば、どうすればよいですか?
1 に答える
ステップ 1.Sketchup モデルを Three.js にロードする
たとえば、.obj として sketchup からエクスポートし、モデル ファイルを Three.js にロードできます。この SO スレッドに例があります。これは、あなたが言及したアニメーションや「オンクリックロジック」を転送しません。この種のアプリケーション ロジックを転送する方法はないと思います。
ステップ 2. クリック イベントの検出
オブジェクトを Three.js シーンにインポートしたら、ユーザーがオブジェクトをクリックしたことを検出する必要があります。この「ピッキング」は、レイをシーンにキャストすることで実行できます。Three.js には、それを行うRaycasterクラスがあります。Raycaster の使用方法の例を次に示します。
ステップ 3. オブジェクトのアニメーション化
オブジェクトの 1 つでクリック イベントを取得したら、それをアニメーション化します。シーン内のオブジェクトをアニメートする方法は 2 つあります。まず、シーン グラフ レベルでリジッド アニメーションを実行できます。たとえばボックスがある場合は、シーン内を移動できます。ボックスは移動、回転、拡大縮小しますが、形状は変わりません。
次に、人間のキャラクターのようなほとんどの有機的なものが行う非剛直なアニメーションがあります。このタイプのアニメーションは、シーン グラフ レベルでは行われませんが、個々の頂点を変換することによって行われます。頂点スキニングを使用してこれを行う方法の例を次に示します。
シーン グラフ レベルのアニメーションは、スキン アニメーションよりも間違いなく単純です。始めたばかりの場合は、おそらくこの単純なタイプのアニメーションに集中する必要があります。