Question

我正在使用three.js创建一个webgl游戏，现在我成功进行了碰撞检测，但我需要在碰撞后从场景中移除碰撞对象我该怎么做？

基本上我遵循本教程

http://webmaestro.fr/blog/basic-collisions-detection-with-three-js-raycaster/

在这里，我将所有障碍都放在障碍变量中，这是我的代码。

function collide(){
    'use strict';

    var collisions, i,
    // Maximum distance from the origin before we consider collision
    distance = 32,
    // Get the obstacles array from our world
    obstacles = getObstacles();
    // For each ray
    for (i = 0; i < rays.length; i += 1) {
        // We reset the raycaster to this direction
        caster.set(objectHolder.position, rays[i]);
        // Test if we intersect with any obstacle mesh
        collisions = caster.intersectObjects(obstacles);
        // And disable that direction if we do
        if (collisions.length > 0 && collisions[0].distance <= distance) {

            // Yep, this.rays[i] gives us : 0 => up, 1 => up-left, 2 => left, ...
            if ((i === 0 || i === 1 || i === 7) && direction.z === 1) {
                // direction.setZ(0);

                console.log("hit!!! up upleft left");

            } else if ((i === 3 || i === 4 || i === 5) && direction.z === -1) {
                // direction.setZ(0);

                console.log("hit!!! i 3 i 4 i 5");
            }
            if ((i === 1 || i === 2 || i === 3) && direction.x === 1) {
                // direction.setX(0);

                console.log("hit!!! i 1 i 2 i 3 x 1");
            } else if ((i === 5 || i === 6 || i === 7) && direction.x === -1) {
                // direction.setX(0);

                console.log("hit!!!");
            } else if (i === 0 || direction.z === 1){
                console.log("hit!!!");
            }
        }
    }

}

这是我做到的障碍功能，我基本上有两个立方体对象并与障碍物连接：

function getObstacles(){
    return obstacles.concat(cube, cube2);
}

现在，当玩家对象击中它时，我该如何移除特定的多维数据集。如果有的话，请你在我的代码中建议更好的碰撞检测方法。

光线投射代码是这样的。

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)
        ];
var caster = new THREE.Raycaster();

在哪里可以获得有关Three.js中使用的类或方法的更多信息，例如光线投射？

Answer 1

回答你的第一个问题。一旦raycaster返回相交的对象数组，您只需将第一个对象传递给scene.remove，如此

scene.remove( collisions[0].object );

就碰撞检测而言，有许多不同的方法。 Raycasting是当前在Three.js中实现的方法。查看Three.js示例和文档页面：http://threejs.org/docs/#Reference/Core/Raycaster。文档有一些差距，但它对像这样的核心功能非常有用。

编辑：刚看到评论，是的，有些文档不完整。但是在每个doc页面的底部都是.js文件的链接，这通常非常有用。在这种情况下，您会注意到Raycaster.js函数返回具有以下结构的intersects数组对象。

intersects.push( {
    distance: distance,
    point: intersectionPoint,
    face: null,
    faceIndex: null,
    object: object
} );

所以至少你可以访问距离，点，面（如果适用），faceIndex（如果适用）和对象:)希望有所帮助。

Three.js碰撞并移除碰撞物体

1 个答案: