question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

PMREMGenerator.fromScene does not render Scene Background correctly

See original GitHub issue
Description of the problem

Hi there,

Currently when using an image background (in this case generated with PMREMGenerator) it seems that producing a PMREM using PREMGenerator’s fromScene will result in a mirroring of the scene’s background in the resulting Envmap.

It’s easier to show than explain, so here’s an example: https://jsfiddle.net/BruOps/e9obh3np/9/

Click the “Update PMREM” button so see what I mean. You’ll see the sky flip on the models.

Three.js version
  • Dev
  • r115
  • Since r112?? That’s what I suspect at least.
Browser
  • All of them
  • Chrome
  • Firefox
  • Internet Explorer
OS
  • All of them
  • Windows
  • macOS
  • Linux
  • Android
  • iOS
Hardware Requirements (graphics card, VR Device, …)

N/A

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Reactions:1
  • Comments:6 (1 by maintainers)

github_iconTop GitHub Comments

2reactions
sciecodecommented, May 13, 2020

Just to confirm: https://jsfiddle.net/rvbwna14/ 😄

2reactions
sciecodecommented, Apr 20, 2020

I think this has to do with the fact that scene.scale.z *= - 1 doesn’t affect the way the background is rendered, so the expected behavior fails. The objects in the scene are rendered correctly, but not the scene background.

Read more comments on GitHub >

github_iconTop Results From Across the Web

PMREMGenerator, CubeCamera and envmap mirroring issues
fromScene produces correct results, although the capture is preformed in the origin, and it seems I have no control on shot location. What...
Read more >
How to dispose scene.environment properly in three.js
After some investigation, I found that the culprit is the WebGLRenderTarget returned by the call to pmremGenerator.fromScene(env_scene).
Read more >
Three.js Backgrounds and Skyboxes
We need to add some CSS to our canvas to set its background to an image ... Of course a static background is...
Read more >
Creating a game in Three.js - LogRocket Blog
Three.js, however, is more limited in its approach and doesn't ... we need to do is create a Scene so Three.js has something...
Read more >
Grassy Beach / Ajay - Observable
//https://discourse.threejs.org/t/how-do-i-use-my-own-custom-shader-as-a-scene-background/13598/2. backgroundMaterial = new THREE.ShaderMaterial ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found