Hey guys, I have been stuck with this problem for few days. I wanna present my scene in THREEJS with baked lighting.
Here is my workflow.
- Prepare the whole scene in blender(using filmic color space with display device set to sRGB)
- Export the scene with gltf with bin file. All materials were set properly. And all color texture were sRGB and property map(roughness, normal) were greyscale.
- Baking lightmap in blender with this setting, to do this, I manually create a 32 bit 1024*1024 image, after baking I save the baked lightmap into 32 bit HDR format.
- Now, in THREE. I correctly load my HDR format lightmap. However, I saw some noticeable color discrepancy between blender and THREE.
I did some research and had some thoughts about my problem,
a. Is there any problem laying 32 bit lightmap on 8 bit srgb texture? From my understand, when applying 32 bit hdr(linear color) lightmap to texture(8 bit srgb, gamma corrected), THREE should be able to automatically transfer srgb to linear color space. So that the lighting calculation should be correct. Hence the sRGB texture should be fine. But I am not sure how THREE will treat HDR(linear color space). I looked in to the glsl shader on github. Here are how THREE handle map(texture) and lightmap in shader.
From my understand(sorry if I am wrong), map were transferred to linear and lightmapwere transferred as well. Hence , my lightmap were transferred twice, which result in wrong results.
If my thoughts were correct, then all I need to do is transfer my linear hdr lightmap to sRGB. Then it should work? But I am afraid the lost data will result in bad rendering result in THREE.
- I am not 100% sure if the 32bit HDR lightmap I saved(from blender) were in linear.is there anyway I could make sure about this?
Any suggestion or directions would be appreciate! Thanks in advance!