三.js与碰撞检测答案

【问题标题】：Three.js and collision detection三.js与碰撞检测
【发布时间】：2015-10-14 01:52:45
【问题描述】：

我是 3D 和 Threejs 的新手。

我设置了一个有地面的场景，地面上有很多立方体。

我正在尝试选择穿过黄色矩形的立方体。

所以我在网上查看了示例，发现了 Raycaster 对象和它的 intersectObject 函数

//**************** colision detection
    var caster = new THREE.Raycaster();
    var collisions = [];

    var rays = [
      new THREE.Vector3(0, 0, 1),
      new THREE.Vector3(1, 0, 1),
      new THREE.Vector3(1, 0, 0),
      new THREE.Vector3(1, 0, -1),
      new THREE.Vector3(0, 0, -1),
      new THREE.Vector3(-1, 0, -1),
      new THREE.Vector3(-1, 0, 0),
      new THREE.Vector3(-1, 0, 1)
    ];

    for ( var i = 0; i < rays.length; i += 1 ) {
        caster.set( squareTL.position, rays[i] );

        for( var boxId in boxGroup ) {
            var boxObj = boxGroup[boxId];

            collisions = caster.intersectObject( boxObj );

            if ( collisions.length ) {
                console.log(collisions);
            } else console.log("no colision");
        }

    }

但是发现了 0 个碰撞。

有一些明显的东西我错过了......

【问题讨论】：

标签： javascript three.js collision-detection

【解决方案1】：

我查看了您的 jsfiddle 代码，并看到了一些应该有帮助的东西：

-您的“boxGroup”数组需要填充另一个包含对象而不是对象本身的数组

-语句：if (collisions.length) 应该改为 (collisions.length >0) 。如果长度 > 1

-可选操作：将碰撞逻辑添加到动画/运行循环中

-我将创建一个新的 JSfeedle 代码，专门用于使用更少对象的碰撞工作。应该更容易调试和理解。

祝你好运， J3zusla

【讨论】：