three.js检测物体是否包含某物体或与某物体相交

695 阅读1分钟

本文已参与「新人创作礼」活动,一起开启掘金创作之路。

包含使用contains相关方法 相交使用intersects相关方法

介绍两种简单的方式

矩形 THREE.Box3

THREE.Box3使用Box3containsBox方法 根据物体生成一个包围盒子

 const a = new THREE.Box3().setFromObject(objectA);
 const b = new THREE.Box3().setFromObject(objectB);

判断a是否包含bBox3.containsBox(Box3)

a.containsBox(b)

适合类似矩形的物体 不适合球形 球形生成矩形包围四周会有大量空白但是也会算尽球形的包围盒内 即在球的附近也会被算进去

也可以判断一个点是否在盒子内Box3.containsPoint(vector : Vector)

球形 THREE.Sphere

适合检测球形 init 传递两个参数 位置和半径

const sphere = new THREE.Sphere(new Vector3(0, 0, 0), 100);

如果想观察创建的球形范围可以根据数据创建一个辅助球形几何体

const geometry = new THREE.SphereBufferGeometry(sphere.radius);
const material = new THREE.MeshBasicMaterial({ color: 0xff0000, wireframe: true });

const mesh = new THREE.Mesh(geometry, material);
mesh.position.copy(sphere.center);
scene.add(mesh);

检测某物体是否在球内实例代码:

 const a = new THREE.Box3().setFromObject(objectA);
 const sphere = new THREE.Sphere(new Vector3(0, 0, 0), 100);
 sphere.intersectsBox(a);

box3 和 sphere都提供多种方法分别传入box3(盒子)类型 plane(平面)类型和sphere(球形)类型Triangle(三角形)类型 相应的这几种类型都有判断是否包含物体以及是否和其他几种类型物体相交的方法

.intersectsBox ( box : Box3 ) : Boolean .intersectsPlane ( plane : Plane ) : Boolean .intersectsSphere ( sphere : Sphere ) : Boolean .intersectsTriangle ( triangle : Triangle ) : Boolean Box3文档 Sphere Plane Triangle