Mesh의 일정 영역을 잘라내기

csg.js는 두 개의 3D 모델이 겹쳐있을 때 하나로 합치거나 겹쳐있는 영역만 빼야 하는 경우에 사용할 수 있는 라이브러리이다.
ThreeCSG.js를 사용하면 csg.js를 Three.js에서도 사용할 수 있다.

아래는 육면체에서 겹쳐져 있는 구만큼의 영역을 지우는 예제이다.

csg.js와 ThreeCSG.js를 가져온다.

<script src="js/csg.js"></script>
<script src="js/ThreeCSG.js"></script>

육면체와 구 생성

// 육면체
var cubeGeometry = new THREE.BoxGeometry(10, 10, 10);
var cube = new THREE.Mesh(cubeGeometry);

// 구
var sphereGeometry = new THREE.SphereGeometry(3, 10, 10);
var sphere = new THREE.Mesh(sphereGeometry);
sphere.position.y = 5;

ThreeBSP 생성

각각 육면체와 구의 mesh를 ThreeBSP에 넘겨준다.

var cubeBsp = new ThreeBSP(cube);
var sphereBsp = new ThreeBSP(sphere);

subtract 함수로 육면체에서 구를 뺀다.

var subtractBsp = cubeBsp.subtract(sphereBsp);

// toMesh 함수를 실행하면 THREE.Mesh를 반환받는다.
var result = subtractBsp.toMesh(new THREE.MeshPhongMaterial({ color: 0xcccccc }));
scene.add(result);

https://302chanwoo.com/lab/three/csg_basic.html