About light map

lighting
texture-baking
lightmap

#1

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.

Can you create a scene like the following with just three.js?


Are there any good ideas?


Ceiling Lights Effect Using THREE.JS
How to create the same video functionality in the link below?
#2

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.


#3

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?


#4

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.


#5

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.


#6

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


#7

This looks like a good starting point to global illumination in three.js https://threejs.org/examples/webgl_simple_gi.html