2012-06-14 12 views
14

Voglio rendere invisibili parti di una mesh in fase di esecuzione. Posso impostare queste parti invisibili/trasparenti, ad es. cambiando gli attributi delle singole facce? La mesh stessa usa solo un materiale.Posso nascondere facce di una mesh in three.js?


esemplare illustrazione come montaggio capisce questa domanda: Imagine una maglia (qui con una geometria di 20 vertici) dove ogni quadrato di quattro vertici costruisce un Face4. Ora alcune parti della mesh dovrebbero essere rese invisibili (qui due facce sono invisibili).

example

+0

La tua domanda non è chiara. Stai cercando di impostare la visibilità delle facce come false (renderle invisibili)? – frank

+0

Ho modificato questa domanda in un modo che sto capendo. Soprattutto perché anch'io ho questa domanda e non voglio creare un duplicato. – Matthias

risposta

23

È possibile assegnare un materiale diverso per ogni faccia. Ecco un esempio in cui le facce condividono un materiale, ma alcuni volti sono trasparenti:

// geometry 
var geometry = new THREE.BoxGeometry(100, 100, 100, 4, 4, 4); 

// materials 
materials = [ 
    new THREE.MeshLambertMaterial({ color: 0xffff00, side: THREE.DoubleSide }), 
    new THREE.MeshBasicMaterial({ transparent: true, opacity: 0 }) 
]; 

// assign material to each face 
for(var i = 0; i < geometry.faces.length; i++) { 
    geometry.faces[ i ].materialIndex = THREE.Math.randInt(0, 1); 
} 
geometry.sortFacesByMaterialIndex(); // optional, to reduce draw calls 

// mesh 
mesh = new THREE.Mesh(geometry, materials); 
scene.add(mesh); 

Aggiornato violino che mostra un modo per cambiare un materiale in fase di esecuzione: http://jsfiddle.net/e0x88z7w/

EDIT: MeshFaceMaterial è stato sconsigliato. Post e violino aggiornati.

three.js r.87

+0

Ma come posso cambiare questi materiali per le facce in * runtime *? Ho aggiunto un click listener al [Fiddle] (http://jsfiddle.net/2FZU7/2/) che dovrebbe rendere nuovamente tutte le facce gialle ma * non funziona *. Ho trovato una [discussione correlata] (https://github.com/mrdoob/three.js/issues/1303) su questo. – Matthias

+0

** Nota: ** Rendere di nuovo tutte le facce gialle è contro il caso d'uso della domanda. Ho [cambiato il codice] (http://jsfiddle.net/2FZU7/3/) per applicare il materiale trasparente ad ogni faccia a clic che non funziona, naturalmente. – Matthias

+1

Questo violino consente le modifiche _runtime_. http://jsfiddle.net/2FZU7/4/. Si basa sulla "discussione correlata" a cui si fa riferimento. Inoltre, poiché i buffer devono essere pre-allocati, non è possibile passare a un materiale più complicato, quindi nel nuovo violino entrambi i materiali sono 'Lambert'. – WestLangley

Problemi correlati