Three.js - sfera che si illumina

Question

Ho un problema. Voglio creare una sfera che funzioni come una fonte di luce (il sole). Ho scoperto che meshPhongMaterial ha un'opzione come emissive: color e shininess: intensity ma non sono riuscito a codificare il sole. Qualcuno sa come farlo? Grazie per le risposte!

Answer 1

mesh Il materiale materiale ha parametri 'emissivi' e 'lucentezza' che influiscono sui calcoli all'interno dello shader del materiale, ma questi non ti daranno l'effetto desiderato, sono solo usati per calcolare il colore finale.

È possibile posizionare il riflettore, ad esempio, nella posizione esatta come sfera, in modo da schiarire l'oggetto attorno ad esso. Tuttavia, se si vuole ottenere l'effetto di sfera incandescente, si dovrebbe scrivere di post-elaborazione degli shader:

• Render sfera di framebuffer 1.
• Render stessa sfera di colore giallo (o di qualche altro colore brillante) to framebuffer 2.
• Sfoca il contenuto nel framebuffer 2 come effetto di post-elaborazione.
• Miscela immagine originale (framebuffer 1) e sfocato framebuffer 2 insieme per produrre l'immagine finale.

Inoltre, alcuni esempi non utilizzano la post-elaborazione effettiva per ottenere l'incandescenza, ma usano un trucco.

Si renderizza la sfera e quindi si esegue il rendering di alcuni quad con texture "glow aura" nella parte posteriore. Visita: http://threegraphs.com/charts/sample/world/ per vedere come puoi simulare il bagliore e creare un cerchio simile all'eclisse attorno alla sfera.

Answer 2

Poiché non si dispone di un problema specifico, non posso darti una risposta specifica. Sembri un po 'perso, però, ecco la cosa si può mancare: Al fine di qualcosa da guardare come una fonte di luce che deve fare due cose:

1. illumina: a raggiungere questo obiettivo con la creazione di un nuovo oggetto della luce dentro. È una buona idea mettere sia il tuo oggetto che la luce all'interno di un nuovo THREE.Object3D.
2. Bagliore: sarà necessario creare uno shader per sfumare i pixel attorno a quell'oggetto. Ho trovato per te un tutorial specifico per three.js: Three.js glow tutorial.

Ci sono tecniche più avanzate che è possibile provare, come aggiungere godrays.

Ti auguro buona fortuna.

Answer 3

Se stai cercando di creare un effetto di bagliore in stile, ho un scritto una serie di esempi in http://stemkoski.github.io/Three.js/ che può essere utile, tra cui:

http://stemkoski.github.io/Three.js/Selective-Glow.html
con accompagnamento post sul blog
http://stemkoski.blogspot.com/2013/03/using-shaders-and-selective-glow.html

nonché i più effetti bagliore atmosferica in stile

http://stemkoski.github.io/Three.js/Atmosphere.html
e
http://stemkoski.github.io/Three.js/Shader-Halo.html

Spero che questo aiuti!