Three.js中Raycaster射线拾取点或线模型时,碰撞范围过小无法精确检测到物体,对于精度问题相关设置

在Three.js中,Raycaster是用于检测场景中物体相交的类。当我们使用Raycaster检测物体相交时,可能会出现准确性的问题,特别是当检测到的对象是点模型或线模型时。这是因为点、线段本身并没有任何厚度,所以它的碰撞面积很小,从而导致可能无法准确地检测到物体的相交

Line线模型解决方案(当然通用 LineLoop 和 LineSegments)

Raycaster.linePrecision,linePrecision属性是一个可选属性,类型为浮点数,默认值为1。它表示在计算射线和线段相交时,额外添加的线段厚度。当我们设置该属性的值时,它将会以单位长度为线段的厚度,并将其添加到线段的两侧,以扩大检测范围。该值越小,检测范围越小,可能会出现未检测到相交的情况;该值越大,则检测范围越大,但可能出现误检的情况。所以需要在具体应用时进行合理的设置。

const geometry = new THREE.BoxGeometry(100, 100, 100)
const material = new THREE.LineBasicMaterial({color: 0xff0000})
const line = new THREE.Line(geometry, material)
const raycaster = new THREE.Raycaster()
raycaster.linePrecision = 3 // 默认值为1,越大越容易选中线模型
const intersects = raycaster.intersectObjects([line, line2, line3])

 Points点模型解决方案

Raycaster.params.Points.thresholdparams属性可以用来获取或设置Raycaster的属性值。其中,params.Points.threshold属性是一个可选属性,类型为浮点数,默认值为1。它表示在检测到模型的顶点集合是一个点云(PointCloud)时,Raycaster检测器所使用的精度(即点与光线相交判定的距离)阈值。当我们使用Raycaster检测点云时,这个 threshold 属性将会影响到 Raycaster 的路径长度判断,从而影响到最近像素上准确的点精度。如果一个点与光线的距离小于这个属性的值,那么这个点将会被视为相交点并被返回到 intersects 中

需要注意的是,当检测精度过低(threshold值设置过小)的时候,可能会出现点被忽略掉的情况,而当精度过高时(threshold值设置过大),又可能出现检测到无关点的情况。

 

const geometry = new THREE.BoxGeometry(100, 100, 100)
const material = new THREE.PointsMaterial({color: 0xff0000, size: 10.0})
const points = new THREE.Points(geometry, material)
const raycaster = new THREE.Raycaster()
raycaster.params.Points.threshold = 5.0
const intersects = raycaster.intersectObjects([points])

猜你喜欢

转载自blog.csdn.net/dabaooooq/article/details/131045322