Is possible to hide the scene background?

Questions
,
1

Recently I learned how to add an environment map to my scene so my objects can reflect it and also it improves the scene lighting overall, but my issue now is that I don’t want the background to be visible, is there a way to hide it without losing its effects on the scene?

For example I have a couple of objects in my scene that serve as clicking zones and because of that I don’t need them to be visible so I do myobject.visible = false and work like a charm hidding the object while still “being there” receiving the raycaster so I can detect clicks on them.

Now in the case of the scene of course I can’t just set visible to false to the scene itself

this is how I added the env map to the scene (I’m omitting a lot of irrelevant code for brevity)

let scene = new THREE.Scene();
...
const loader = new RGBELoader();
loader.load(texturePath, (texture) => {
  scene.background = texture;
  scene.environment = texture;
})

this is how it looks with the background added:

Screenshot_20240318_002622

and this is without it (i.e. scene.background = false):

Screenshot_20240318_003208

adding an L plane helps but the results are not better than with a background added.

2

Background has no effect on objects in the scene - you can just remove the line in which you set scene.background and leave scene.environment.

2 Likes
3

what do you mean by has not effect? because as I see it does have an effect as you can see in the two images an attached

4

It could be caused by you modifying the background texture (which is shared in your code with environment) somewhere else.

But in three.js itself, scene.background has no effect besides being the first drawn “color layer”, above which the rest of the scene is rendered. It does not affect reflections or light (assuming you’re using WebGLRenderer ofc.)

5

Oh silly me, you are right, I was modifying the envMap prop in another place, thank you for the hint!

2 Likes