この記事では、babylon.js webglエンジン內(nèi)の衝突検出、物理學(xué)、および境界ボックスの基礎(chǔ)について、oimo.js物理エンジンによって強化されています。 これらの概念を紹介するデモを作成します

babylon.js espilit physics demo with oimo.js

（http://www.miracleart.cn/link/e1dd47cc816ac88ccd8100451384c97a実際のリンク）重要な概念：

コリダーは計算を簡素化します：複雑なメッシュ衝突検出の代わりに、よりシンプルな目に見えないジオメトリ（コリダー）がCPU負荷を大幅に削減します。

衝突対物理學(xué)エンジン：

babylon.jsは基本的な衝突（カメラの動きなど）を処理しますが、oimo.jsは力と現(xiàn)実的な動きを伴う動的なシミュレーションを有効にします。
• リアリズムのための物理學(xué)：Babylon.jsの物理學(xué)と重力を有効にすると、バウンスや衝突などの現(xiàn)実的なオブジェクトの相互作用が可能です。
• インタラクティブなメッシュ操作：サポートのピッキングユーザーは、力をクリックして力を適用してオブジェクトと対話できます。
デバッグツール：
• babylon.jsのデバッグツールは、シーン要素を視覚化し、物理パラメーターを調(diào)整します。
衝突検出が説明されています：
• ウィキペディアによって定義されている衝突検出は、オブジェクト間の交差點を識別する計算プロセスです。 これは、ゲームやシミュレーションで重要です。 この検出の複雑さは重要な考慮事項です。 特にJavaScriptでは、詳細なメッシュ間の衝突のテストは計算上高価です。 これを管理するには、
コリダー
• 。を使用します
コリダー：

コリダーは、衝突検出のメッシュを表すシンプルで見えない形狀（境界ボックスや球體など）です。 これにより、計算が簡素化され、パフォーマンスが向上します。 コリダー（ボックス、球、カプセル、またはメッシュ）の選択は、メッシュの形狀に依存します。 ESPilitデモは、以下に示すように、境界ボックスを使用します：

（実際の畫像URLに置き換えます）

この畫像は、黃色のデッキ（メッシュ）とその境界ボックスコリダーを示しています。

（実際の畫像URLに置き換えます）

これは、spilitシーンの半透明な赤い境界ボックスを示しています。 シーンの読み込み

： これらの方法のいずれかを使用して、spilitシーンをロードできます。

1. githubからダウンロード：プロジェクトのgithubリポジトリからシーンをダウンロードし、Microsoft Virtual Academy（MVA）コースの指示に従ってください（実際のリンクと交換）ロードで.babylonシーン。
2. Visual Studioソリューション：事前に構(gòu)築されたVisual Studioソリューションをダウンロードしてください

oimo.jsで物理學(xué)を有効にする：

物理學(xué)を追加するには、次のコードを使用します

これにより、重力が設(shè)定され、Oimo.jsを物理エンジンとして指定します。 次に、

scene.enablePhysics(new BABYLON.Vector3(0, -10, 0), new BABYLON.OimoJSPlugin());

を有効にして見えないメッシュを繰り返し、物理的特性をアクティブにします：

checkCollisions

for (var i = 1; i < scene.meshes.length; i++) {
    if (scene.meshes[i].checkCollisions && scene.meshes[i].isVisible === false) {
        scene.meshes[i].setPhysicsState(BABYLON.PhysicsEngine.BoxImpostor, { mass: 0, friction: 0.5, restitution: 0.7 });
        meshesColliderList.push(scene.meshes[i]);
    }
}

物理オブジェクトの作成：

以下のコードは、物理的特性を備えた球體とボックスを追加します：

// ... (Material creation code) ...

function addListeners() {
    // ... (Key press event handlers) ...
}

ピッキングサポートの追加：

オブジェクトをクリックして力を適用できるようにするには、

canvas.addEventListener("mousedown", function (evt) {
    // ... (Picking and impulse application code) ...
});

境界ボックスの表示（デバッグ）：

デバッグUI（以下を參照）により、コリダーの視認性と物理的特性を切り替えることができます。 このUIのコードは、簡潔に省略されています

（実際の畫像URLに置き換えます）

（実際の畫像URLに置き換えます）

結(jié)論：

このチュートリアルは、oimo.jsを使用してbabylon.jsの衝突検出と物理學(xué)を理解し、実裝するための基盤を提供します。 提供されたデモとコードのスニペットは、実用的な例を提供します。 Babylon.jsとoimo.jsのドキュメントのさらなる調(diào)査が奨勵されます。 （関連するドキュメントへのリンクを含む）

以上がBabylon.jsおよびoimo.jsとの衝突と物理學(xué)の理解の詳細內(nèi)容です。詳細については、PHP 中國語 Web サイトの他の関連記事を參照してください。