场景中两个对象之间的三个 js RayCast

Posted

技术标签:

【中文标题】场景中两个对象之间的三个 js RayCast【英文标题】:Three js RayCast between two object in scene 【发布时间】:2018-12-29 06:44:50 【问题描述】:

我知道当点击鼠标时如何在场景中投射物体,但现在我需要知道场景中的两个物体是否可以相互投射。

这是,我在场景中加载一个 3D 对象,例如 OBJ 对象中的两个房间,然后我在某些点添加三个网格框,例如第一个房间的两个点和第二个房间的一个点。

那么第一个房间的两个点可以互相光线投射(有直视),但是第一个房间的两个点不能光线投射到第二个房间的点。(他们没有通过房间墙壁的视觉)。

我附上了用于加载场景和点的代码,有什么建议吗?

//LOAD MAIN 3D OBJECT
    var objLoader = new THREE.OBJLoader();
        objLoader.setMaterials(materials);
        objLoader.setPath('./asset/3d/');
        objLoader.load("model01.obj", function(object)
            var mesh = object.children[0];
            mesh.castShadow = true;
            mesh.receiveShadow = true;

            mesh.rotation.x = Math.PI / 2;

            var box = new THREE.Box3().setFromObject( object )
            var ox = -(box.max.x + box.min.x) / 2;
            var oy = -(box.max.y + box.min.y) / 2;
            var oz = -(box.max.z + box.min.z) / 2;
            mesh.position.set(ox, oy, oz);

            _scene.add(mesh);

            render();

            setTimeout(render, 1000);

        

//LOAD count_points inside scene
for(var i=0;i<cta_points;i++)
    var c_r = 2;
    var c_geometry = new THREE.BoxBufferGeometry( c_r, c_r, c_r );
    var c_material = new THREE.MeshLambertMaterial(  color: new THREE.Color("rgb("+(40 +   30)+", 0, 0)"),opacity: 0.0,
                        transparent: true );                       
    var c_mesh = new THREE.Mesh( c_geometry, c_material );
    var position = get_positions(i);
    c_mesh.position.copy(position);                                                 
    c_mesh.name="BOX";
    scene.add( c_mesh );    

【问题讨论】:

THREE.Raycaster().set() 方法。 【参考方案1】:

不妨看看:

How to detect collision in three.js?

通常,要解决此问题,您会使用碰撞组制作碰撞蒙版。

碰撞组是按对象添加的,并由位掩码中的“位”表示,

墙可以在单独的碰撞组中,例如 4(二进制 100)

对象可能在另一个组中,比如 2(二进制 10)

然后你只需要检查对象与面具的碰撞。

(检查碰撞组是否与位掩码匹配(上面的掩码可能是 10、100)以检查碰撞)。

这样,您可以调用 THREE.Raycaster().intersectObjects(args),其中的参数是通过位掩码测试 (mask == object.collision_group) 的参数。

这样,您就不需要在碰撞检测测试中包含墙,因为它使用单独的位掩码。

【讨论】:

以上是关于场景中两个对象之间的三个 js RayCast的主要内容,如果未能解决你的问题,请参考以下文章

两个兄弟组件之间的数据传输问题(Vue js)

在场景之间共享游戏对象

three.js 第二篇:场景 相机 渲染器 物体之间的关系

如何使用缓冲测量法在两个点之间用鼠标向下绘制三个js中的动态线

组合的实现

如何在三个 js 3d .dae 对象中添加按钮