[NEWBIE] How to export lightmap for glTF 2.0?

Support Materials and Textures
1

Hi,

I’ve done the protocol explained in the doc:

lightmap_blender
lightmap_blender1181×847 88.1 KB

But lightmap doesn’t display in threeJs.

I’d need help to find my errors. Thanks if you can :wink:

2

Here’s the screen of display error in threejs:

lightmap_wrong

3

I’ve just tried the classic multiply approach, displaying is perfect in blender:

lightmap_blender_2
lightmap_blender_21435×904 109 KB

But… my glTF is worse…

4

lightmap_wrong_2

Now glTF exports lightmap with texture coordinates. HELP ME !!!

5

If i believe this topic, the problem is in gltf exporter:

6

According to these people:

Threejs doesn’t use directly the second texture as a lightmap, so, maybe i need a some javascript workaround ?..

7

I’ve found the workaround. glTF doesn’t support lightmaps, so, store the texture elsewhere, for example in emissiveMap. Then, in your 3d engine, create a new material using it as a lightmap.

let newMat = new THREE.MeshBasicMaterial({map: obj.material.map , lightMap: obj.material.emissiveMap });
obj.material.dispose();
obj.material = newMat;

Now it works.

lightmap_ok

8

Here’s the final version of my shader:

lightmap_blender_3
lightmap_blender_3959×887 76.3 KB

9

Thx for writing down the solution as well with so much detailed.
Had the same issue and this helped a lot!