three.js - TubeGeometry + DecalGeometry su un segmento del tubo

Question

Voglio inserire una decalcomania all'interno di un segmento di una geometria del tubo (nel backface).

Il modo in cui lo faccio è utilizzare TubeGeometry come geometria della decalcomania.

Questo è quello che ho:

E questo è ciò che voglio: (cattivo disegno) Codice

Esempio:

//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 
    ); 

Tuttavia questo sembra applica una decalcomania del tubo lungo tutto il percorso della geometria del retro. E lo voglio solo su una parte del BackSide of the Tube sulle posizioni chiave.

Come si può realizzare un'etichetta decimale localizzata in un oggetto TubeGeometry utilizzando THREE.DecalGeometry? È possibile?

Answer 1

Sarà necessario utilizzare un ShaderMaterial per questo, e definire le regole di posizionamento e opacità nel codice shader e le varie uniform (ad esempio, la nuova texture) e parameter (ad esempio, UV) valori passati ad esso per tre. js.