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

<p>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..</p>

<pre><code>diffuseIllum = lightColour * dot(normal, lightDir);
outputColour = textureColour.rgb * diffuseIllum;
</code></pre>

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

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

<pre><code>diffuseIllum = lightColour * dot(normal, lightDir);
outputColor = mix(textureColour.rgb * diffuseIllum, textureColour.rgb, texture.a);
</code></pre>

<p>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.</p>

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

<p>e.g.</p>

<pre><code>outputColour = textureColour.rgb * diffuseIllum + textureColour.rgb * textureColour.a;
</code></pre>

<p>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.</p>

<p>e.g. </p>

<pre><code> outputColour = textureColour.rgb * diffuseIllum + emissiveTextureColour.rgb;
</code></pre>

CC BY-SA 3.0
2017-05-09T09:53:38.163Z
2017-05-09T10:01:10.883Z
2017-05-09T10:01:10.883Z
PaulHK
<p>A self-illuminating texture is rather easy. You can use the fragmentshader to increase the color value of those pixels.</p>

<p>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.</p>

<p>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.</p>

CC BY-SA 3.0
2017-05-09T07:01:58.150Z
2017-05-09T07:01:58.150Z
Djindjidj
<p>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.</p>

CC BY-SA 3.0
2017-04-23T16:37:28.247Z
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.
trichoplax is on Codidact now
CC BY-SA 3.0
2017-04-23T16:58:37.423Z
@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"
B.junior
CC BY-SA 3.0
2017-04-23T18:54:41.777Z
@trichoplax By the way, I think I have to apply a kind of "glowing" texture that emits light, so it should affect nearby objects
B.junior
CC BY-SA 3.0
2017-04-23T19:40:57.910Z
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.
trichoplax is on Codidact now
CC BY-SA 3.0
2017-04-24T00:14:10.500Z
hm normally you'd do multiple passes, somehting like this: http://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?
Charlie
CC BY-SA 3.0
2017-04-24T11:22:14.663Z
yeah, I checked what I have to do and I have to apply a glow map through textures, but I can't find a good reference that explains the procedure :(
B.junior
CC BY-SA 3.0
2017-05-09T08:43:52.710Z
It is important to note that glow is certainly not light emission! You should probably edit your question
joojaa
<texture><lighting><webgl>
Emission of light from texture on WebGL
B.junior
# Emission of light from texture on WebGL

(Asked by: username_0 on 2017-04-23)

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.

**Tags:** texture, lighting, webgl

> **Comments:**
> **username_1**: 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.  
> **username_0**: @username_1 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"  
> **username_0**: @username_1 By the way, I think I have to apply a kind of "glowing" texture that emits light, so it should affect nearby objects  
> **username_1**: 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.  
> **username_2**: hm normally you'd do multiple passes, somehting like this: http://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?  
> **username_0**: yeah, I checked what I have to do and I have to apply a glow map through textures, but I can't find a good reference that explains the procedure :(  
> **username_3**: It is important to note that glow is certainly not light emission! You should probably edit your question  

---

## 2 answers

### Answer by username_4 on 2017-05-09. Score: 3 | Accepted answer

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.

e.g.

```
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.

e.g.

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

```


---

### Answer by username_5 on 2017-05-09. Score: 2

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 username_2 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.


---

