THREE-CSGMesh
用于现代THREE.js的CSG(构造实体几何)库的转换
原始版本: 版权所有 (c) 2011 Evan Wallace (http://madebyevan.com/),基于MIT许可证。
THREE.js重制版由thrax基于MIT许可证完成。
这里是一个运行演示 https://manthrax.github.io/THREE-CSGMesh/demos/CSGDemo.html
还有一个更光滑、稍微复杂一些的演示: https://manthrax.github.io/THREE-CSGMesh/demos/CSGShinyDemo.html
以及一个更复杂的例子,展示了通过中间立方体将文本网格切入另一个复杂网格:
https://manthrax.github.io/THREE-CSGMesh/v2/index.html
展示多个材质组和顶点颜色通道的示例:
https://manthrax.github.io/THREE-CSGMesh/demos/CSGMulti.html
CSG是一种生成新几何体作为两个输入几何体函数的技术名称。
CSG有时在3D建模软件中被称为"布尔"运算。
内部使用一种称为BSP(二进制空间分割)树的结构来执行这些操作。
支持的操作有.subtract、.union和.intersect。
通过使用这3种操作的不同组合,并改变输入模型的顺序,你可以构造输入模型的任意组合。
在上面的第一个截图/演示中,我展示了立方体和球体的可能结果...
蓝色是球体->立方体和立方体->球体的.union操作结果(在这种情况下结果相同)
绿色是球体->立方体和立方体->球体的.intersect操作结果(在这种情况下结果相同)
红色是球体->立方体和立方体->球体的.subtract操作结果。这里的结果因输入顺序不同而不同。
使用示例:
示例0:
//最小示例..从网格a中减去网格b:
import {CSG} from "three-csg.js"
scene.add(CSG.toMesh(CSG.subtract(CSG.fromMesh(a),CSG.fromMesh(b)),a.material))
示例1. 详细...逐步进行..
// 制作2个盒子网格..
let meshA = new THREE.Mesh(new THREE.BoxGeometry(1,1,1))
let meshB = new THREE.Mesh(new THREE.BoxGeometry(1,1,1))
//将其中一个盒子偏移半个宽度..
meshB.position.add(new THREE.Vector3( 0.5, 0.5, 0.5)
//确保每个网格的.matrix是最新的
meshA.updateMatrix()
meshB.updateMatrix()
//从每个网格创建一个bsp树
let bspA = CSG.fromMesh( meshA )
let bspB = CSG.fromMesh( meshB )
// 通过.subtract从一个bsp中减去另一个..其他支持的模式是.union和.intersect
let bspResult = bspA.subtract(bspB)
//从结果bsp中获取结果网格,并将meshA.material分配给结果网格
let meshResult = CSG.toMesh( bspResult, meshA.matrix, meshA.material )