I have been utilizing the three.js geometry class to generate shapes and then applying multiple CSG operations on those shapes, resulting in constant redraws of the shape.
The process of performing these multiple CSG operations is quite sluggish, as I am relying on ray-casting to select the shape upon clicking and carry out CSG with a pre-defined shape (any type of shape or geometry).
As a result, I have the following inquiries:
Would switching to buffer geometry help accelerate my CSG calculations? And if so, are there any libraries available for carrying out CSG operations on instances of
THREE.BufferGeometry
?Are there alternative methods that could potentially speed up this process?
This is the flow of my code:
var objects = [];
init();
render();
function init(){
// Setup scene and camera ... etc
var sphere = new THREE.SphereGeometry(200, 32, 32);
objects.push(sphere);
// Set up raycasting
// Bind mouse click and move events
}
function onMouseDown() {
var intersects = raycaster.intersectObjects(objects);
.....
// Extract intersected shape ..
// Perform CSG operation with pre-defined shape
// Includes steps for converting geometry to *CSG library geometry*
and back to Three.js geometry)..
// Replace the shape with the updated one
.....
render();
}
I have been using this library for CSG operations, and the overall procedure resembles this example in the three.js demo site.