CODEWITHSUNDEEP
three.js3dselectionraycastingbounding-box
Marek Krzeminski
Marek Krzeminski

Reputation: 1398

Three.js algorithm for marquee selecting in 3D scene

I'm creating a 3D model editor application using THREE.js where you can load a CAD model and have it display on the screen. You can pan, zoom, rotate the camera anywhere around in the scene to view the CAD model from any angle.

I want to add support to be able to draw an arbitrary rectangle on the screen (marquee select box) and anything inside this box I'd like to become selected.

What is a good algorithm to use for this operation?

My first thought was to take every loaded CAD part (that can be selected), and project its bounding box onto the screen. Then test each of these projected bounding boxes to the selection box drawn on the screen for matches. This should work, however I'm worried it would be very slow for large CAD models with 1000's of selectable parts.

Is there a better way to do marquee selections in 3D? Can raycasting somehow be used to speed up the selections?

Upvotes: 1

Views: 662

Answers (1)

Garrett Johnson
Garrett Johnson

Reputation: 2534

Without knowing more details about your cad models it'll be a bit hard to give exactly relevant suggestions but I can suggest a few things I might try.

Use Hierarchical Bounding Boxes

If you have a multi-level tree of meshes you can generate bounding boxes for the non-leaf nodes of the tree. This isn't supported directly in THREE but you can manually create and check against these objects before checking if the child objects are within the marquee.

If your tree isn't spatially organized very well or is very flat then you can build an oct-tree and traverse the oct-tree nodes before checking the meshes.

Of course these data structures have to be updated whenever meshes move in your CAD model.

Cache World Bounds

If you cache versions of the bounding boxes on all the meshes in world space then instead of projecting the bounds into screen space you can create a frustum from the marquee in world space and check the all the mesh bounds without having to do any transformation of those boxes.

Asynchronous Checking

Instead of gathering all the intersected bounds on a single frame you could gather them up over multiple frames if it is taking a long time.

Unfortunately I don't think raycasting can do a whole lot for you here.

Hopefully that helps!

Upvotes: 0

Related Questions