GGX mipmap sampling

Hi all,

I was trying to mimic the mipmap sampling from this example, but for some reason, it doesn’t work on my project. I tried both with the HDR and the LDR images using the code I found on the example but I had no luck.

I’ve recorded this video that shows that when I’m loading the images using the standard THREE.CubeTextureLoader(), I can sample the mipmaps fine in my THREE.ShaderMaterial() by updating the roughness uniform in my fragment code textureCube(envMap, reflectVector, roughness). But when I use the THREE.PMREMGenerator() and THREE.PMREMCubeUVPacker() nothing is happening.

The only difference to my knowledge is that I’m using the files from the examples/js folder instead of the examples/jsm.

Below is some code:

Standard CubeTextureLoader (working)

 var textureCube = new THREE.CubeTextureLoader().setPath('./imgs/pisaLDR/').load([ 'px.jpg', 'nx.jpg', 'py.jpg', 'ny.jpg', 'pz.jpg', 'nz.jpg' ]);

PMREM version (not working)

 var textureCube = new THREE.CubeTextureLoader()
 .setPath( './imgs/pisaLDR/' )
 .load( [ 'px.jpg', 'nx.jpg', 'py.jpg', 'ny.jpg', 'pz.jpg', 'nz.jpg' ], function () {

      textureCube.encoding = THREE.sRGBEncoding;

      var pmremGenerator = new THREE.PMREMGenerator( textureCube );
      pmremGenerator.update( renderer );

      var pmremCubeUVPacker = new THREE.PMREMCubeUVPacker( pmremGenerator.cubeLods );
      pmremCubeUVPacker.update( renderer );

      ldrCubeRenderTarget = pmremCubeUVPacker.CubeUVRenderTarget;

      pmremGenerator.dispose();
      pmremCubeUVPacker.dispose();

 });

Fragment sampling

 vec4 envMapColor = textureCube(envMap, reflectVector, roughness);

Animation code

objects[0].material.uniforms.roughness.value = (Math.abs(Math.sin(clock.getElapsedTime())) * 5);

Any ideas?

Thanks,
Nick