Skip to content

Constructive Solid Geometry (CSG)

Description

The CSG branch demonstrates,

  • Using the Union method to return a new Mesh consisting of Mesh A and Mesh B
  • Using the Intersects method to return a new Mesh where Mesh A and Mesh B overlap each other.
  • using the Subtract method to return a new Mesh where Mesh B is subtracted from Mesh A

To load the CSG example, checkout the csg branch.

git clone https://github.com/Sean-Bradley/Three.js-TypeScript-Boilerplate.git

cd Three.js-TypeScript-Boilerplate

git checkout csg 

npm install

npm run dev

Union

Return a new CSG solid consisting of A and B

A.union(B)

+-------+            +-------+
|       |            |       |
|   A   |            |       |
|    +--+----+   =   |       +----+
+----+--+    |       +----+       |
     |   B   |            |       |
     |       |            |       |
     +-------+            +-------+

Subtract

Return a new CSG solid where B is subtracted from A

A.subtract(B)

+-------+            +-------+
|       |            |       |
|   A   |            |       |
|    +--+----+   =   |    +--+
+----+--+    |       +----+
     |   B   |
     |       |
     +-------+

Intersect

Return a new CSG solid where both A and B overlap

A.intersect(B)

+-------+
|       |
|   A   |
|    +--+----+   =   +--+
+----+--+    |       +--+
     |   B   |
     |       |
     +-------+

CSG Tree CSG Tree Image By User:Zottie - Own work, CC BY-SA 3.0, https://commons.wikimedia.org/w/index.php?curid=263170

Constructive Solid Geometry