2014-05-16 3 views
4

J'expérimente actuellement un peu avec three.js et j'essaye d'ajouter un effet de bloom. cependant, quand DSAI la fleur, il est plus comme un flou d'une floraison réelle:three.js bloom est un flou?

enter image description here

le code:

composer = new THREE.EffectComposer(renderer, renderTarget); 
effectBloom = new THREE.BloomPass(1, 25, 5); 
composer.addPass(renderModel) 
composer.addPass(effectBloom); 
composer.addPass(copyPass) 

et son être rendu avec:

composer.render(delta) 

Je voudrais me rapprocher de ceci:

enter image description here

+0

Je regardais le shader [ici] (https://github.com/mrdoob/three.js/blob/b7279adc60d366ff33a3e662576f349720139820/examples/js/shaders/ConvolutionShader.js) Vous devrait probablement avoir cette voie jaune plus claire, sinon vous p un point flottant rend la texture vous-même. Le code [ici] (https://github.com/mrdoob/three.js/blob/6ff842c0f4a1fbe99e741ffac6e99ff7749f1f1c/examples/js/postprocessing/BloomPass.js) semble dire que le passage de flou est juste superposé et c'est ce que le matériel à la ligne 30 le fait. Essayez d'ajouter un autre passage de copie avec votre résultat de rendu bloom, sur votre sortie actuelle, pourrait travailler – pailhead

+0

merci pour la réponse rapide, j'ai augmenté la luminosité de la voie jaune maintenant, et j'ai essayé d'ajouter un autre passage de copie. mais im complètement nouveau à ce genre de programmation, je ne suis pas sûr si la passe ne fonctionne pas, ou im faire quelque chose de mal. probablement le dernier. Si ce n'est pas trop ennuyeux pourriez-vous me donner une explication succincte de la façon dont les passes sont traitées? –

+2

J'ai trouvé la solution en utilisant des exemples, s'avère que la solution était très simple, et pas vraiment dans ma question. 'renderer.autoClear = false;' je pourrais toujours utiliser cette explication pour référence future tho. –

Répondre

4

J'ai eu ce problème similaire. Bloom était en train de rendre l'image rendue floue. Pour résoudre le problème que je devais mettre renderer AUTOCLEAR false:

renderer.autoClear = false; 

Et dans mon rendu boucle je devais faire la compensation manuellement juste avant d'utiliser le compositeur pour rendre la scène:

renderer.clear(); 
composer.render(); 

Vérifiez mon stylo pour voir en action: http://codepen.io/jaamo/pen/BoKXrL

+1

exemple de plume –

0

Une bloom est une image floue, super imposée par rapport à votre rendu principal. Vous avez probablement besoin de plus d'une gamme dynamique pour créer l'effet comme vu dans l'image jointe.