Applying cube map to scene

Hello,

I am currently trying to apply a cubemap to my scene so all of my objects in the scene will have reflectivity based on the cubemap / environment map.

I am using my own preloader so I don’t need to use the cubetextureloader, instead I am able to just make a CubeTexture and pass in my textures.

It looks like they are all there and being created, I just can’t seem to get the cubemap to be visible? I’m wondering if I am applying it correctly? Here is my relevant code.

var textures = [
    this.preload.getTexture("px"),
    this.preload.getTexture("nx"),
    this.preload.getTexture("py"),
    this.preload.getTexture("ny"),
    this.preload.getTexture("pz"),
    this.preload.getTexture("nz")
  ];

  var cubemap = new THREE.CubeTexture(textures);
  cubemap.format = THREE.RGBFormat;
  this.scene.environment = cubemap;

Thanks

This line is obsolete since RGBFormat is the default format for cube textures.

In order to replicate the exact same behavior like CubeTextureLoader, it’s important that this.preload.getTexture() returns an instance of HTMLImageElement, HTMLCanvasElement or ImageBitmap. You also have to set CubeTexture.needsUpdate to true when all images are fully loaded.

1 Like

Gotcha!

It is returning them as textures would I have to type cast as ImageBitmap maybe?

EDIT:

It looks like I got it by having it get the texture.image :slight_smile: Thank you so much!

1 Like