# NodeMaterials, Env Maps, Tonemapping and Exposure **URL:** \ **Category:** Questions\ **Tags:** material, pbr, environment\ **Created:** [April 22, 2021, 1:24pm UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223 "2021-04-22T13:24:14Z")\ **Posts on this page:** 20\ **Page:** 1
**Author:** ![Valentine](https://avatars.discourse-cdn.com/v4/letter/v/7ab992/32.png) [@Valentine](https://forum.babylonjs.com/u/Valentine)\ **Post date:** [April 22, 2021, 1:24pm UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/1 "2021-04-22T13:24:14Z")
Finding some really strange behaviour in how NME materials behave with HDR environment maps right now. I think there are elements of the Babylon rendering pipeline I don’t fully understand, within which NME materials are being treated differently from PBRMaterials in a way that doesn’t make sense to me. **Observation #1:** NME Materials don’t respect imageProcessingConfiguration.exposure. ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/b/b0d24f8a635fafa9811610e641a994f27ac0e3a7.jpeg) PBR left, PBR NME with a Reflection node right. At exposure 1.0 they look about the same, but lowering exposure darkens the reflection in the PBR material while NME material looks unchanged. This is odd as I would expect both materials to be rendering to an HDR rendertarget and for global tonemapping to affect them equally. **Observation #2:** Okay, so I guess the NME material is forward rendered and just isn’t aware of the exposure value. Perhaps I can override this by adding a scalar multiply to the PBR output? ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/b/b659b2bdcfc1a226d00c2e0c0bfc993ee658c0d2.png) Unfortunately, this doesn’t have the desired effect: ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/b/be2a235ba84d043cda2082fb694034b742856185.jpeg) PG can be found here: [https://playground.babylonjs.com/#WGZLGJ#2855](https://playground.babylonjs.com/#WGZLGJ#2855) So it seems like tonemapping in the NME happens inside the PBR node, but there is no direct way to influence the reflection strength. The closest I could get to is to multiply the reflection colour in this PG: But even this doesn’t result in the same behaviour as changing exposure: [https://playground.babylonjs.com/#WGZLGJ#2856](https://playground.babylonjs.com/#WGZLGJ#2856) ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/d/d05e15b6fcb9bbd7a1774222f995ac022de7fcf0.jpeg) **Observation #3:** I suspect something similar is happening when PBR glass is used in combination with NME materials. I don’t have a PG for this yet, but I suspect that when overlaps with bright HDR materials, something gets messed up in the tonemapping pipe, though I’m wondering if this applies to just NME materials: ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/6/670d91e310d67c29777ff3f4366c6b9ba5844b68.jpeg) ---
**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\ **Post date:** [April 22, 2021, 4:21pm UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/2 "2021-04-22T16:21:03Z")
Adding @Evgeni_Popov ---
**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\ **Post date:** [April 22, 2021, 4:21pm UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/3 "2021-04-22T16:21:43Z")
Quick note: you need to add the image processing block to support exposure, etc… ---
**Author:** ![Valentine](https://avatars.discourse-cdn.com/v4/letter/v/7ab992/32.png) [@Valentine](https://forum.babylonjs.com/u/Valentine)\ **Post date:** [April 22, 2021, 4:52pm UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/4 "2021-04-22T16:52:15Z")
That’s good to know! Are there any good examples of the image processing block in action? ---
**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\ **Post date:** [April 22, 2021, 5:30pm UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/5 "2021-04-22T17:30:21Z")
Nothing specific: simply drop it at the end like that: ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/1/1779577f4782a9e8536ace6ba97e46d91d39528a.png) ---
**Author:** ![Valentine](https://avatars.discourse-cdn.com/v4/letter/v/7ab992/32.png) [@Valentine](https://forum.babylonjs.com/u/Valentine)\ **Post date:** [April 22, 2021, 5:38pm UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/6 "2021-04-22T17:38:22Z")
Hmm, it’s giving me some odd behaviour. If I use a material like [this one](https://nodematerial-editor.babylonjs.com/#W43527#9) in the PG, it errors out. In my local scene it does work as a material, but doesn’t seem to be affected by exposure changes, and strongly burns colours in an odd way. Here’s the updated PG with that material: [https://playground.babylonjs.com/#WGZLGJ#2857](https://playground.babylonjs.com/#WGZLGJ#2857) ---
**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\ **Post date:** [April 22, 2021, 5:49pm UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/7 "2021-04-22T17:49:56Z")
Adding @Evgeni_Popov ---
**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\ **Post date:** [April 22, 2021, 7:05pm UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/8 "2021-04-22T19:05:58Z")
PR: > > > See https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposur…e/20223/5 The PBR block already supported image processing but not fully. After the PR is merged, it will support the full image processing feature set and you won’t need a `ImageProcessing` block: just link the `lighting` output to the `FragmentOutput` rgb input. ---
**Author:** ![Valentine](https://avatars.discourse-cdn.com/v4/letter/v/7ab992/32.png) [@Valentine](https://forum.babylonjs.com/u/Valentine)\ **Post date:** [April 23, 2021, 2:47pm UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/9 "2021-04-23T14:47:34Z")
Thanks @Evgeni_Popov! Is there a way currently to work around it in the NME material in this PG [https://playground.babylonjs.com/#WGZLGJ#2855](https://playground.babylonjs.com/#WGZLGJ#2855) using the ImageProcessing node, or do we need to wait for the new build to come through? ---
**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\ **Post date:** [April 23, 2021, 3:45pm UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/10 "2021-04-23T15:45:52Z")
No, I don’t see a way to make it work in the current state, but the changes have been merged so they will be available from the next nightly build (which should be in a few hours). ---
**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\ **Post date:** [April 23, 2021, 6:16pm UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/11 "2021-04-23T18:16:51Z")
It’s now available in the preview CDN / on the Playground. ---
**Author:** ![Valentine](https://avatars.discourse-cdn.com/v4/letter/v/7ab992/32.png) [@Valentine](https://forum.babylonjs.com/u/Valentine)\ **Post date:** [April 24, 2021, 12:42am UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/12 "2021-04-24T00:42:41Z")
Looks good on PG! Will grab and test latest npm when it’s available 🙂 (not sure if there’s an easy way of running preview build except running a local build?) ---
**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\ **Post date:** [April 24, 2021, 9:50am UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/13 "2021-04-24T09:50:54Z")
The packages are available on the preview CDN: [https://preview.babylonjs.com/babylon.js](https://preview.babylonjs.com/babylon.js) for eg for the core package. ---
**Author:** ![br-matt](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/br-matt/32/22436_2.png) [@br-matt](https://forum.babylonjs.com/u/br-matt)\ **Post date:** [April 24, 2021, 12:52pm UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/14 "2021-04-24T12:52:51Z")
Sorry for all the questions, is there a way to `npm install` the above or update `package.json` ? I was doing some poking and did not find ---
**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\ **Post date:** [April 24, 2021, 3:32pm UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/15 "2021-04-24T15:32:03Z")
I think you need to install the preview by doing: `npm install babylonjs@preview` However, npm packages are built infrequently, I don’t know when the latest build has been done… ---
**Author:** ![Valentine](https://avatars.discourse-cdn.com/v4/letter/v/7ab992/32.png) [@Valentine](https://forum.babylonjs.com/u/Valentine)\ **Post date:** [April 28, 2021, 1:03am UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/16 "2021-04-28T01:03:32Z")
Thank you for the fix, solves reflections beautifully 🙂 The glass issue mentioned in my first post still persists - I’m looking at trying to repro it in a PG. I think the problem might be in part due to the fact that we’re using emissive maps in our node-based PBR materials. As there is no emissive input into the PBR node, we’ve been adding emissive onto the lighting output, prior to piping the colour out. But given that there is some of the image processing happening inside the PBR node, obviously any emissive added in that way would be excluded from e.g. exposure controls. What would be the best way of handling emissive contribution in a way that is consistent with the rest of the tonemapping operations and the PBR node material? ---
**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\ **Post date:** [April 28, 2021, 10:21am UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/17 "2021-04-28T10:21:21Z")
Yes, the problem comes from the fact the emissive color is not factored in before applying image processing. What you can do is handling the computation in linear space instead: that’s what all the outputs above `lighting` are for. You need to sum them all, add the emissive color (in linear space too!) and plug this into an `ImageProcessing` block: [https://playground.babylonjs.com/#WGZLGJ#2893](https://playground.babylonjs.com/#WGZLGJ#2893) You will notice some black parts in the sphere: that’s because the `ImageProcessing` is expecting its input to be in gamma space (because it is applying a linear space conversion to what we link to the input), so there’s a conversion to gamma space and it happens it is this conversion that produces this artifact. We should not need this conversion in the first place (as the `ImageProcessing` code is doing the computation in linear space anyway), so here’s a PR that add a switch to the `ImageProcessing` block to disable the conversion to linear space: > > > See https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposur…e/20223/15 Once the PR is merged, this PG will work as expected: [https://playground.babylonjs.com/#WGZLGJ#2895](https://playground.babylonjs.com/#WGZLGJ#2895) ---
**Author:** ![Valentine](https://avatars.discourse-cdn.com/v4/letter/v/7ab992/32.png) [@Valentine](https://forum.babylonjs.com/u/Valentine)\ **Post date:** [April 28, 2021, 11:33am UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/18 "2021-04-28T11:33:02Z")
Ah! Thank you for demonstrating that, this makes sense now - I was not expecting at all for imageProcessing to want an input in gamma space, so that’s something that was stumping me 🙂 And I missed, initially, that Lighting returns the sum output in gamma, while the other outputs are linear. That’s so much clearer now. I’m sure this is on the roadmap for the node material editor, but it would be great to have that behaviour flagged slightly more visibly in the future. Looking at [Node Material | Babylon.js Documentation](https://doc.babylonjs.com/divingDeeper/materials/node_material/nodeMaterial) I can see that it does talk about the PBR node materials, some being linear and Lighting being in gamma space, but this does not get mentioned e.g. for the imageProcessing node. ---
**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\ **Post date:** [April 28, 2021, 3:14pm UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/19 "2021-04-28T15:14:36Z")
Adding @PirateJC for the doc update 😉 ---
**Author:** ![PirateJC](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/piratejc/32/1003_2.png) [@PirateJC](https://forum.babylonjs.com/u/PirateJC)\ **Post date:** [April 28, 2021, 6:53pm UTC](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223/20 "2021-04-28T18:53:35Z")
Docs have been updated with a note about this! Awesome callout @Valentine! > Should be live in a couple minutes here: > **[Node Material | Babylon.js Documentation](https://doc.babylonjs.com/divingDeeper/materials/node_material/nodeMaterial#creating-pbr-materials)** > > The Node Material is a simple, highly customizable material that you can build yourself piece by piece. Combined with the powerful node-based editor, [Next page](https://forum.babylonjs.com/t/nodematerials-env-maps-tonemapping-and-exposure/20223.md?page=2)