threecsg provides boolean modeling operations for Three.js meshes and geometry. This creates new objects that are the union (addition), difference (subtraction), or intersection (overlap) of two existing objects. Its API is designed to be just as simple as Three.js's mesh creation, requiring no understanding of the underlying geometry or mesh object structure.
There are three main methods exported by the threecsg module which provide the boolean
operations for adding, subtracting, and intersecting meshes. These account for any translation, rotation,
and scaling on the source meshes and return a new mesh which is un-rotated and un-scaled, but is positioned
to keep the resulting geometry in the same location relative to the sources.
const material = new THREE.MeshNormalMaterial();
const box = new THREE.Mesh(new THREE.BoxGeometry());
const sphere = new THREE.Mesh(new THREE.SphereGeometry());
sphere.scale.set(0.7, 0.9, 0.7);
box.quaternion.set(0, 1, 0, 1).normalize();
box.position.set(-2, 0, 0);
sphere.position.set(-1.6, 0, 0);
const unionmesh1 = threecsg.union(box, sphere, material);
scene.add(unionmesh1);
box.position.set(2, -0.5, 0);
box.quaternion.set(0, 0, -0.5, 1).normalize();
sphere.position.set(2, 0.2, -0.4);
sphere.quaternion.set(1, 0, 1, 1).normalize();
const unionmesh3 = threecsg.union(sphere, box, material);
scene.add(unionmesh3);
const material = new THREE.MeshNormalMaterial();
const box = new THREE.Mesh(new THREE.BoxGeometry());
const sphere = new THREE.Mesh(new THREE.SphereGeometry());
sphere.scale.set(0.7, 0.9, 0.7);
box.quaternion.set(0, 1, 0, 1).normalize();
box.position.set(-2, 0, 0);
sphere.position.set(-1.6, 0, 0);
const subtractmesh1 = threecsg.subtract(box, sphere, material);
scene.add(subtractmesh1);
box.position.set(2, -0.5, 0);
box.quaternion.set(0, 0, -0.5, 1).normalize();
sphere.position.set(2, 0.2, -0.4);
sphere.quaternion.set(1, 0, 1, 1).normalize();
const subtractmesh3 = threecsg.subtract(sphere, box, material);
scene.add(subtractmesh3);
const material = new THREE.MeshNormalMaterial();
const box = new THREE.Mesh(new THREE.BoxGeometry());
const sphere = new THREE.Mesh(new THREE.SphereGeometry());
box.quaternion.set(0, 1, 0, 1).normalize();
box.position.set(-2, 0, 0);
sphere.position.set(-1.6, 0, 0);
const intersectmesh1 = threecsg.intersect(box, sphere, material);
scene.add(intersectmesh1);
box.position.set(2, -0.5, 0);
box.quaternion.set(0, 0, -0.5, 1).normalize();
sphere.position.set(2, 0.2, -0.4);
sphere.quaternion.set(1, 0, 1, 1).normalize();
const intersectmesh3 = threecsg.intersect(sphere, box, material);
scene.add(intersectmesh3);