I have encountered an issue with a gltf file. When I import it into the Three.js editor (), everything appears as expected when adding an environment map.
However, when I import the same gltf file into my project scene, I notice a discrepancy in the result, even though I am using the exact same HDRI image. The metalness seems overly shiny in this case.
Can anyone provide insight on what might be causing this difference? Thank you.
renderer.toneMapping = THREE.ACESFilmicToneMapping;
renderer.toneMappingExposure = 1;
renderer.outputEncoding = THREE.sRGBEncoding;
new RGBELoader()
.load( 'royal_esplanade_1k.hdr', function ( texture ) {
texture.mapping = THREE.EquirectangularReflectionMapping;
scene.environment = texture;
} );
loader.load(
'./gltf/canette.glb',
// callback function when resource is loaded
function ( gltf ) {
obj = gltf.scene;
mixer = new THREE.AnimationMixer( gltf.scene );
action = mixer.clipAction( gltf.animations[ 0 ] );
// add object to scene
scene.add( obj );
}
);
EDIT:
Here is a live demo. Here is the gltf model.