Need help in group collision detection

Hi @Mugen87/ @mrdoob ,

I am new to Three.Js and got some issue while working on it.

I need to work on wall frames and one wall can have a multiple windows.

I am able to create and load .FBX object of Wall to my scene which contains many child objects(windows). Now I need to join two walls and change the shape of the joint.

As per my understanding this can be done using raycaster to get the collision detection.

I have used the raycaster and collision detection and that works fine for me if I have a cube object.

But when I am trying to use the same functionality with my .FBX object it given an error that vertices not found. I have done some R&D and got to know that my object is a Group and group don’t have any geometry.

Code for Collision Detection:

var originPoint = MovingCube.position.clone();

for (var vertexIndex = 0; vertexIndex < MovingCube.geometry.vertices.length; vertexIndex++)


var localVertex = MovingCube.geometry.vertices[vertexIndex].clone();

var globalVertex = localVertex.applyMatrix4( MovingCube.matrix );

var directionVector = globalVertex.sub( MovingCube.position );

var ray = new THREE.Raycaster( originPoint, directionVector.clone().normalize() );

var collisionResults = ray.intersectObjects( collidableMeshList );

if ( collisionResults.length > 0 && collisionResults[0].distance < directionVector.length() )




Your question about collision detection with raycasting is considered as a “low-effort” question since it was already asked multiple times at stackoverflow and other forums.

Your geometry is most likely of type BufferGeoemtry which does not have a .vertices property.

Thanks @Mugen87 for your response.
As you said BufferGeometry does not have a .vertices then how should I move further in collision detection?

You could position attribute to access the vertices of a BufferGeometry. Check this out.

Is this the essence of the question?

Joining and modifying arbitrary geometries is non-trivial. I would check out how to rebuild the geometry using CSG methods, as discussed here and in other threads.

That code will be hopelessly inefficient, even if you get it to work. You are iterating over vertices of one geometry, and then casting rays into others. The built-in raycast of three.js iterates over all faces of the geometry, and does not “remember” anything from previous raycasts. So all faces are iterated for every source vertex, that is V*F, where V is the number of source vertices and F is the number of target faces. If all the geometries are really simple it will work, but as soon as you add any complexity to both the ray source and the ray “recipients”, it will hang for ages. Actually, and I consider this a weakness of three.js, even if you only add substantial complexity to the target meshes you will have lag.

That is right. Groups collect other objects, some of which may have geometries. If you really want to iterate over all vertices in a group, you must keep track of the combined transforms during traversal.

BufferGeometry is the recommended type of geometry nowadays. Geometry is “dying”.