web-dev-qa-db-fra.com

Trois matériaux filaires JS - tous les polygones par rapport aux bords

J'utilise ThreeJS dans un projet et j'ai remarqué que les anciennes versions rendent les wireframes différemment des versions plus récentes, et je ne peux pas comprendre comment revenir en arrière (ce que je préfère).

Ce violon utilisant la version 54 ne rend que les bords extérieurs de l'objet dessiné avec un matériau filaire: http://jsfiddle.net/ksRyQ/ ou comme illustré ici au cas où cela est spécifique à la plate-forme (je suis sur mac chrome):

enter image description here

D'un autre côté, lorsque j'exécute localement le même code en utilisant la nouvelle version r61, je vois chaque Edge de polygone, comme dans:

enter image description here

le code dans les deux cas est simple:

material = new THREE.MeshBasicMaterial({
    color: 0xff0000,
    wireframe: true
});

Je suis sûr que je pourrais faire le cube avec des lignes ou quelque chose, mais je préfère vraiment comprendre le problème.

Des indices? Y a-t-il un paramètre pour cela ou quelque chose qui peut être modifié? Secondairement, vous remarquerez qu'en ce moment ce code utilise le rendu de toile, bien que je prévoie d'utiliser le rendu webGL, mais le même phénomène est vrai avec les deux (même s'il existe d'autres différences).

35
tekunokurato

Si vous voulez rendre un filaire d'un geometry donné, vous pouvez maintenant utiliser ce modèle:

var geo = new THREE.EdgesGeometry( geometry ); // or WireframeGeometry( geometry )

var mat = new THREE.LineBasicMaterial( { color: 0xffffff, linewidth: 2 } );

var wireframe = new THREE.LineSegments( geo, mat );

scene.add( wireframe );

WireframeGeometry rendra tous les bords. EdgesGeometry rendra uniquement les bords durs.

Voir aussi cette réponse connexe sur la façon de rendre à la fois un modèle et son filaire.

EDIT: mis à jour à three.js.r.82

63
WestLangley