I have to build a texture of a cube that models the emission of light by the object. Any tips? I really don't know where to start.

  • $\begingroup$ Could you expand on the requirements? When you say "texture", does this require variation in light emission across the surface, or can it just be a uniformly glowing cube? Does it need to affect nearby objects or just to appear emissive alone? Writing down exactly what is required may also help you come up with ideas. $\endgroup$ Commented Apr 23, 2017 at 16:37
  • $\begingroup$ @trichoplax this is the assignment: "combine the lighting with a texture (256x256) that models the emission of light by the object. Generate this texture randomly with values between 0 and 128 for each component. The amount of light emitted by the object must be added to the computed lighting" $\endgroup$
    – B.junior
    Commented Apr 23, 2017 at 16:58
  • $\begingroup$ @trichoplax By the way, I think I have to apply a kind of "glowing" texture that emits light, so it should affect nearby objects $\endgroup$
    – B.junior
    Commented Apr 23, 2017 at 18:54
  • 1
    $\begingroup$ If it's an assignment, I'd recommend double checking exactly what is required with your teacher/tutor/lecturer so you don't end up giving yourself a bigger task than is required. $\endgroup$ Commented Apr 23, 2017 at 19:40
  • $\begingroup$ hm normally you'd do multiple passes, somehting like this: io7m.com/documents/glow-maps/s3.xhtml idk if you can render to a frame buffer object with webgl. I guess the question is: does webgl support frame buffer objects? $\endgroup$
    – Charlie
    Commented Apr 24, 2017 at 0:14

2 Answers 2


Presumably you are using a lighting system already, let's say Lambert shading for simplicity..

So we have a texture which is going to be illuminated by some light source. The following psuedo/shader code will do lambert shading as normal..

diffuseIllum = lightColour * dot(normal, lightDir);
outputColour = textureColour.rgb * diffuseIllum;

But we want certain parts of our texture to emit colours instead of being illuminated by only our light source.

One method would be to use an extra channel in the input texture, say the Alpha channel, to control which pixels are emissive

diffuseIllum = lightColour * dot(normal, lightDir);
outputColor = mix(textureColour.rgb * diffuseIllum, textureColour.rgb, texture.a);

Unfortunately this won't work so well if you want say a dark red glow because the output pixel will either be the emissive colour (dark red) or the lit texture colour, which could be much brighter. In effect our emissive areas could end up darker than the surrounding illuminated areas.

We could add the emissive colour to the illuminated texture but that limits how much control over final colour we have.


outputColour = textureColour.rgb * diffuseIllum + textureColour.rgb * textureColour.a;

A more correct method would involve using 2 textures, one for diffuse illumination and another for purely emissive. These would be added together in the pixel shader.


 outputColour = textureColour.rgb * diffuseIllum + emissiveTextureColour.rgb;

A self-illuminating texture is rather easy. You can use the fragmentshader to increase the color value of those pixels.

If you want a "halo"-like effect it gets more complicated. As Charlie said, you'd have to render in multiple passes. Render your texture only in a first pass, blur it and adjust color / brightness and put that information on top of your main render pass.

If you even want your texture to illuminate surrounding objects it gets even more complicated. You could go for a texture projection for static purposes. Or you could average the texture information into one color and place an omni light in front of the emitting cube face. There are better solutions though, I am sure.


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.