如何让玩家控制与墙壁相撞为三

Question

我有一个三分。

我加载它：

// map
var loader = new THREE.JSONLoader(true);
var thiz = this;
loader.load(
    "iceworld.js"
    , function(geometry, materials) {
        materials[0].side = THREE.DoubleSide;
        var faceMaterial = new THREE.MeshLambertMaterial( materials[0] );
        //var faceMaterial = new THREE.MeshBasicMaterial( { map: THREE.ImageUtils.loadTexture( 'ice.jpg' ), side: THREE.DoubleSide } );
       mesh = new THREE.Mesh( geometry, faceMaterial );
       thiz.scene.add( mesh );
     }
);

我使用PointerLockControls。现在我可以穿过地图的墙壁，因为没有碰撞检测。

我该如何实施？我在示例和文档中没有找到解决方案。

Answer 1

three.js是一个图形渲染库，不关心碰撞检测。您需要不同的东西。这是一些选择：

• 如果您的场景主要是平面和矩形，即即使是3D，玩家只能在一个2D飞机上行走，墙壁上有简单的形状，您可以创建一个简单的网格，标记障碍物的位置，然后检查玩家的位置与网格坐标，如果机芯在墙壁内部结束，则取消动作。
• 使用物理引擎：Physijs是一种易于使用且灵活的子弹动力学引擎包装器，适用于三个。您可以将场景网格包裹在单个Physijs.ConcaveMesh中，在相机中添加碰撞形状并具有瞬间，准确的碰撞检测 - 但是如果您的场景很复杂，那将很慢。
• 一种更好的方法是将您的场景分解成离散的物体，例如矩形墙壁部分，并为它们单独添加廉价的碰撞形状（例如立方体，球形，圆柱体）。Physijs可以做到这一点，然后有Cannon.js（请参阅此处的FPS演示）。
• 滚动您自己的碰撞检测。我真的不建议这样做，因为它是一个兔子洞，但它将使您完全控制哪些功能，准确性和性能权衡非常适合您。

就个人而言，我已经创建了一个使用三分的FPS游戏。我的电平设计非常规规律，因此我可以使用网格方法进行播放器碰撞，但是我也想要动态对象（例如枪管，盒子等），并且使用Physijs允许我几乎太琐碎地整合了它们。因此，通过在墙壁部分中创建生理学多维数据池来处理墙壁碰撞。