Scene enviroment set hdr file use TextureLoader

Questions
, , ,
1

i want set scene enviroment use hdr file but hdr file load only RGBELoader
if i use RGBELoader data type is Uint16Array but i want change data type is img cause i want use url data
so i try hdr file load use TextureLoader but it not work
how can i change data type is img or use TextureLoader when i load hdr file

  const loader = new RGBELoader();
    loader.setDataType(THREE.HalfFloatType);
    const textureLoader = new THREE.TextureLoader();
    loader.load(
      "https://locall.hdr",
      (hdrTexture) => {
        console.log(hdrTexture);
        textureLoader.load(hdrTexture.source.data, (texture) => {
          copyScene.environment = texture;
          console.log(texture);
        });
      },
      (xhr) => {
        console.log((xhr.loaded / xhr.total) * 100 + "% loaded");
      },
      (error) => {
        console.error("Error loading HDR texture", error);
      }
    );

thank you and have a nice day

2

You could use the RGBELoader to load a hdr, and then you need to change the renderer.toneMapping .

The easiest code like this:

const loader = new RGBELoader();
loader.load(url, (texture) => {
   texture.mapping = EquirectangularReflectionMapping;
   scene.environment = texture;
});

renderer.toneMapping = ACESFilmicToneMapping;
renderer.toneMappingExposure = 1;

Also, you could see the examples about tone mapping.

1 Like
3

thank you so much
i try this