I have an object(LineA) that is composed of 4 children and sub-children. They are Meshes(MeshLineMaterial) and ArrowHelpers. Then I have another set of objects(Other Lines) of the same kind.
I am trying to create a system where when I create LineA, it shouldn’t collide/cross with Other Lines.
I have tried the bounding box and raycaster:
function collision()
{
var originPoint = LineA.position.clone();
var bb=new THREE.BoxHelper(LineA, 0x00ff00);
bb.geometry.computeBoundingBox();
var collidableMeshList = OtherLines;
for (var vertexIndex = 0; vertexIndex < bb.geometry.attributes.position.array.length; vertexIndex++)
{
var ray = new THREE.Raycaster( bb.position, bb.geometry.attributes.position.array[vertexIndex] );
var collisionResults = ray.intersectObjects( collidableMeshList );
if ( collisionResults.length > 0)
{
console.log("true");
hit = true;
}
}
}
I tried referring to this example
function detectCollisionCubes(bb, Line2bb){
bb.geometry.computeBoundingBox(); //not needed if its already calculated
Line2bb.geometry.computeBoundingBox();
bb.updateMatrixWorld();
Line2bb.updateMatrixWorld();
var box1 = bb.geometry.boundingBox.clone();
box1.applyMatrix4(bb.matrixWorld);
var box2 = Line2bb.geometry.boundingBox.clone();
box2.applyMatrix4(Line2bb.matrixWorld);
return box1.intersectsBox(box2);
}
None of them seems to be working in my case.
They show no error.
Any help would be greatly appreciated.