# About light map

**URL:** <https://discourse.threejs.org/t/about-light-map/1152>\
**Category:** Questions\
**Tags:** lighting, lightmap, texture-baking\
**Created:** [November 6, 2017, 2:44pm UTC](https://discourse.threejs.org/t/about-light-map/1152 "2017-11-06T14:44:10Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![h.shira](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/h.shira/32/8666_2.png) [@h.shira](https://discourse.threejs.org/u/h.shira)\
**Post date:** [November 6, 2017, 2:44pm UTC](https://discourse.threejs.org/t/about-light-map/1152/1 "2017-11-06T14:44:10Z")

</div>

I was at a loss as to whether to listen here.  
please.

I,m making architectural viewer.  
Since there is no procedure to create a light map, I am creating a scene with only direction light and ambient light.  
The following is the scene that I am making.  
 ![image](https://cdck-file-uploads-canada1.s3.dualstack.ca-central-1.amazonaws.com/flex035/uploads/threejs/original/1X/90cb3f4904fd82ff5e6556aae23ef0955fa67c74.jpg)

Can you create a scene like the following with just three.js?  
 ![image](https://cdck-file-uploads-canada1.s3.dualstack.ca-central-1.amazonaws.com/flex035/uploads/threejs/original/1X/a3aae6ef78a9dd7c6c975512ef00b84022c9f027.jpg)  
Are there any good ideas?

---

<div class="post-metadata">

**Author:** ![FrankSilvaHM](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/franksilvahm/32/117_2.png) [@FrankSilvaHM](https://discourse.threejs.org/u/FrankSilvaHM)\
**Post date:** [November 7, 2017, 4:01pm UTC](https://discourse.threejs.org/t/about-light-map/1152/2 "2017-11-07T16:01:57Z")

</div>

This is called “Baking”… Begin there. You will find all sorts of tutorials for _baking_ your scenes/meshes in your 3D app’s (Blender, LightWave, C4D, 3DS Max, Maya, etc) native renderer, or GPU renderer (Octane, VRAY, Redshift, etc) if you have one.

---

<div class="post-metadata">

**Author:** ![h.shira](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/h.shira/32/8666_2.png) [@h.shira](https://discourse.threejs.org/u/h.shira)\
**Post date:** [November 8, 2017, 2:19pm UTC](https://discourse.threejs.org/t/about-light-map/1152/3 "2017-11-08T14:19:29Z")

</div>

Yes, I understand baking.  
I am looking for ways to not process in advance.

For example, like Runtime Lightmap Generation.  
I am looking for ways to realize it with three.js.

Are there any good, open source or samples?

---

<div class="post-metadata">

**Author:** ![looeee](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/looeee/32/59_2.png) [@looeee](https://discourse.threejs.org/u/looeee)\
**Post date:** [November 8, 2017, 2:33pm UTC](https://discourse.threejs.org/t/about-light-map/1152/4 "2017-11-08T14:33:12Z")

</div>

You will not be able to create a real time scene that looks like your second example and runs in the browser without baking textures beforehand.

---

<div class="post-metadata">

**Author:** ![Fyrestar](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/fyrestar/32/52793_2.png) [@Fyrestar](https://discourse.threejs.org/u/Fyrestar)\
**Post date:** [November 8, 2017, 6:05pm UTC](https://discourse.threejs.org/t/about-light-map/1152/5 "2017-11-08T18:05:27Z")

</div>

It’s possible, but requires a lot more techniques THREE doesn’t offer out of box. It’s demanding, so you would need to exclude mobile anyway. I recommend to bake with external software, you can’t expect that powerful hardware in the web.

If you want to process it within THREE you would have to implement GI and all the features yourself, a render software like 3DS Max, C4D or Blender is highly recommended for this task.

---

<div class="post-metadata">

**Author:** ![h.shira](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/h.shira/32/8666_2.png) [@h.shira](https://discourse.threejs.org/u/h.shira)\
**Post date:** [November 10, 2017, 2:44pm UTC](https://discourse.threejs.org/t/about-light-map/1152/6 "2017-11-10T14:44:49Z")

</div>

thank you everyone.  
It seems good to bake in advance.

---

<div class="post-metadata">

**Author:** ![rockclimber](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/rockclimber/32/1043_2.png) [@rockclimber](https://discourse.threejs.org/u/rockclimber)\
**Post date:** [February 1, 2018, 11:17pm UTC](https://discourse.threejs.org/t/about-light-map/1152/7 "2018-02-01T23:17:56Z")

</div>

This looks like a good starting point to global illumination in three.js [https://threejs.org/examples/webgl\_simple\_gi.html](https://threejs.org/examples/webgl_simple_gi.html)