0

我正在使用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 中使用的类或方法的更多信息,例如 raycasting ?

4

1 回答 1

2

回答你的第一个问题。一旦光线投射器返回相交对象数组,您只需将第一个对象传递给 scene.remove 就可以了

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

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

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

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

因此,至少您可以访问距离、点、面(如果适用)、faceIndex(如果适用)和对象 :) 希望对您有所帮助。

于 2013-08-19T13:16:37.680 回答