RGBELoader low quality of texture - 256 x 256

Question

For some reason RGBELoader() generates 256x256 textures regardless of what the source is (4k). I tried using the pmremGenerator and it doesn't seem to work with or without it.

new RGBELoader()
                .setPath( './maps/' )
                .load( 'empty_warehouse_01_4k.hdr', function ( texture ) {

                        //texture.mapping = THREE.EquirectangularReflectionMapping;
                        const envMap = pmremGenerator.fromEquirectangular( texture ).texture;

                        scene.background = envMap; //or 'texture' to bypass pmremGenerator
                        scene.environment = envMap;

}

let pmremGenerator = new THREE.PMREMGenerator( renderer )
pmremGenerator.compileEquirectangularShader();

Here's the result:

This is the 4k HDR quality:

The only example that has high quality background and environment map is this one but it uses THree.CubeTextureLoader() and it only takes LDR (.jpg).

https://threejs.org/examples/?q=env#webgl_materials_envmaps [Source]

Answer 1

RGBELoader does not alter the resolution of your texture. The problem in your code is that the result of PMREMGenerator should not be used for Scene.background.

Besides, the renderer automatically preprocesses assigned HDR environment map with PMREMGenerator for PBR materials since r131. So when loading HDR environment maps via classes like RGBELoader or EXRLoader, there should be no reason for using PMREMGenerator on app level with latest releases.

Please use the official glTF example as a code template: https://threejs.org/examples/webgl_loader_gltf