标签：描述 相加 sha 绘制 sub link 就是 链式 res
这一篇郭先生就说说ThreeBSP（组合网格）的使用，先上图，在线案例点击ThreeBSP案例。
组合网格允许我们使用二元操作函数操作网格，但是提前需要引入threeBSP.js,它提供了如下三个函数。
| 名称 | 描述 |
|---|---|
| intersect（相交） | 使用该函数可以在两个几何体的交集上创建新的几何体。两个几何体相互交叠的部分就是新的几何体 |
| union（联合） | union函数可以将两个几何体联合在一起创建出新的几何体。 |
| subtract（相减） | subtract与union函数相反。通过这个函数你可以在第一个几何体中减去两个几何体交叠的部分，从而创建出新的几何体 |
我们先绘制所需的几何体
var material = new THREE.MeshPhongMaterial({color: 0x2C85E1, shininess: 60, specular: 0x2C85E1}) var cylinGeom1 = new THREE.CylinderGeometry(40, 40, 10, 50) var cylinMesh1 = new THREE.Mesh(cylinGeom1, material); //最大的圆柱 var cylinGeom2 = new THREE.CylinderGeometry(28, 28, 14, 50) var cylinMesh2 = new THREE.Mesh(cylinGeom2, material); //第二大的圆柱 var cylinGeom3 = new THREE.CylinderGeometry(20, 20, 22, 50) var cylinMesh3 = new THREE.Mesh(cylinGeom3, material); //第三大的圆柱 var cylinGeom4 = new THREE.CylinderGeometry(10, 10, 24, 50) var cylinMesh4 = new THREE.Mesh(cylinGeom4, material); //最小的圆柱 var pointsArr = [[5, -1, 33], [5, 11, 33], [-5, -1, 33], [-5, 11, 33], [20, -1, 66], [20, 11, 66], [-20, -1, 66], [-20, 11, 66]]; var points = pointsArr.map(d => new THREE.Vector3(d[0],d[1],d[2])); var tixing = new ConvexGeometry(points); var tixingMesh = new THREE.Mesh(tixing, material); //通过ConvexGeometry凸包绘制一个梯台，当然也可以使用ExtrudeGeometry挤压几何体， var meshArray = []; for(var i=0; i<8; i++) { tixingMesh.rotation.y = Math.PI / 4 * i; meshArray[i] = tixingMesh.clone() } //通过旋转，得到各个方向的梯台
现在我们得到了四个圆柱和若干梯台，如下图。
var cylinBSP1 = new ThreeBSP(cylinMesh1); // 由大到小四个网格的BSP模型 var cylinBSP2 = new ThreeBSP(cylinMesh2); var cylinBSP3 = new ThreeBSP(cylinMesh3); var cylinBSP4 = new ThreeBSP(cylinMesh4); //前三个模型相加减去第四个模型得到新的BSP模型，允许链式调用 var resultBSP = cylinBSP1.union(cylinBSP2).union(cylinBSP3).subtract(cylinBSP4); for(var i=0; i<8; i++) { //新的BSP模型分别减去各个方向的梯台模型得到结果模型 resultBSP = resultBSP.subtract( new ThreeBSP(meshArray[i]) ); }
这个结果模型对象并不是一个网格，但是他有很多方法，包括toGeometry、toMesh、toTree以及intersect、union、subtract方法，使用toMesh或者toGeometry即可得到我们所需的网格或者几何体。
注意使用ThreeBSP.js操作segments分段数多的几何体速度较慢建议转换后保存模型。
转载请注明地址：郭先生的博客
标签：描述 相加 sha 绘制 sub link 就是 链式 res
原文地址：https://www.cnblogs.com/vadim-web/p/13291482.html
