threejs 纹理流动_Threejs—BIM管道流向动态效果

BIM管道流向主要是描述管道内液体流动方向的一个业务场景，

在BIM管道分析展示中一个比较常用的场景，这次基于threejs的纹理流动，实现一版效果，主要如下：

原理很简单就是借助TubeGeometry，配合MeshPhongMaterial材质，在设置texture 的时候，给一个循环函数，让纹理的offset(偏移)每次都递增，就可以达到感觉有一个流动的特效。

 // 此部分为了展示为hardcode
const pathArr = [
4624.99, 2329.38, -5843.11,
4624.99, 4643.14, -5843.11,
1437.47, 4643.14, -5819.36,
1413.69, 4643.14, -1854.40,
-6983.28, 4643.14, -1854.04,
-7078.43, 4643.14, 2149.46
]
const  radius =  500

核心代码函数createTube如下

 // 动态创建一个管道
function createTube(pathArr, radius) {
    
let curveArr = [