three.js - 管段上的TubeGeometry + DecalGeometry

Question

我想在一个管几何体的一段（在背面）中放一个贴花。

我的方法是使用TubeGeometry作为贴花几何体。

这就是我所拥有的：

这就是我想要的：  （糟糕的绘图）

示例代码：

//code
var tube = new THREE.TubeGeometry(pipelineSpline, 200, 20, 20, closed2);

tubeMesh = THREE.SceneUtils.createMultiMaterialObject(
       geometry, [
            material,       // a phong material
            materialInside // a material for the inside               
       ]);

scene.add(tubeMesh); 

var decalGeometry = new THREE.DecalGeometry(
      tubeMesh.children[0], 
      new THREE.Vector3(0,0,0),      //position
      new THREE.Vector3(0,1,0),      //direction
      new THREE.Vector3(10,10,10),   //dimensions
      new THREE.Vector3(0,0,0)       //check
    );

然而，这似乎沿着所有背面几何路径应用了管的贴花。而且我只希望它在关键位置的背面管的一部分上。

如何使用THREE.DecalGeometry在TubeGeometry中制作局部贴花？有可能吗？

Answer 1

您需要使用ShaderMaterial，并在着色器代码和各种uniform（例如，新纹理）和parameter中定义定位和不透明度规则（例如，由THREE.js传递给它的UV值。