前言管线显示在3D场景中非常常见。例如地下管网的展示、建筑物内的水果、供暖通风管道等。建立管线的方式主要有两种:通过3DMaxC4DBlender等建模工具进行建模。根据路径数据,程序生成三维管道。如果需要通过数据动态生成pipeline,只能使用第二种方式生成。生成管线的方式三中,可以通过TubeGeometry生成管线。TubeGeometry可以沿3D样条线拉伸管。路径可以通过指定顶点来定义。创建TubeGeometry管线几何时,可以输入以下参数:路径(必需)此属性使用THREE.SplineCurve对象来指定管线所遵循的路径。segments此属性指定管道的段数。路径越长,指定的段数应该越多。默认值为64radius该属性指定了管道的半径,默认值为1radiusSegments否该属性指定了管段的段数,段数越多管道看起来越光滑,默认值为8closed该属性用于设置管道是否连通,默认值为false例如:constpoints=[{x:0,y:0,z:0},{x:100,y:0,z:0},{x:100,y:0,z:200},];constpath=createPath(点);constpipeGeometry=newTHREE.TubeGeometry(path,256,radius,64);constpipeMaterial=newTHREE.MeshPhongMaterial({color});constpipe=newTHREE.Mesh(pipeGeometry,pipeMaterial);效果如下:TubeGeometry优化TubeGeometry通过指定路径和段数创建管道的几何数据。TubeGeometry的段分布均匀,会出现问题。如果路径很长很复杂,需要分段的数量很大才能保证几何的精度。然而,管道大部分是直的,只有少数弯曲的管道。对于直管线,实际上只有路径的起点和引入点才能完整地描述路径。只有弯曲的管道,路径需要分成很多端点,分别取每个段点的数据。为了更好的完成曲线的描述。如果采用平均分割的方法,必然会有很多段落在直线上,造成资源浪费。同时,分段数多,创建的几何数据会比较大、臃肿,影响程序加载、绘图效率、显存等。例如,下面的一系列点都形成了两条直线:constpoints=[{x:0,y:0,z:0},{x:100,y:0,z:0},{x:100,y:0,z:200},];当段数为4时:newTHREE.TubeGeometry(path,4,radius,64);得到如下结果:原来的两条直线变成了三条直线的效果,原因是线段数不够:增加线段数:newTHREE.TubeGeometry(path,256,radius,64);效果如下:为了画一条由两条直线组成的路径,线段数为256,顶点数可想而知。这样我们就可以有一个优化思路。对于直线部分的路径,不需要分段,直接走到起点和终点就可以了。段数只分配给弯曲部分。这样的分割方法可以使分割数得到最合理的应用。基于此,我们改造了一个新类:PathTubeGeometry。修改后的类绘制上面两条直线不带切片数(切片数为1),如下:newPathTubeGeometry(path,1,radius,64);大大节省了资源。转角弯头两条直线相连的地方,可以加一点圆角效果,增加管道的美观度。下面的代码可以根据已有路径自动生成带弯头的路径。函数getRoundCornerPath(oldPath,radius,path=newPath3D()){letpoints=oldPath.points;点数=removeDup(点数);让p0=点[0];路径.moveTo(p0);for(leti=1;i
