Question

我想使用sibl。

const loadHDR = () => {
    new THREE.RGBELoader().load('./resource/textures/HDR/Etnies_Park_Center_3k.hdr', (texture, textureData)=> {
    texture.encoding = THREE.RGBEEncoding;
    texture.minFilter = THREE.NearestFilter;
    texture.magFilter = THREE.NearestFilter;
    texture.flipY = true;

    console.log(texture)

    textureData.height = 1200
    textureData.width = 1200
    textureData.exposure = 10
    console.log(textureData)


    const cubemap = new THREE.EquirectangularToCubeGenerator(texture, { resolution: 3200, type: THREE.UnsignedByteType });
    exrBackground = cubemap.renderTarget;
    cubeMapTexture = cubemap.update(renderer);
    texture.dispose();
})
}

这是我的代码。和

console.log(textureData)

上面的代码结果很好地显示了修改后的值。但是cubemap的曝光不会改变。

另一个问题是读取.ibl文件我必须读取webgl中太阳的位置，但无法读取该文件。我正在使用webpack。 fs库不存在。

Answer 1

我也一直尝试使用RGBELoader调整曝光。看起来您必须将其设置为渲染器的属性，因为列出的属性仅由回调函数中的模块返回。他们没有“设置”任何东西。

自您提出此问题以来，与环境地图相关的功能似乎已发生了很大变化。例如，THREE.EquirectangularToCubeGenerator显然不再存在。看来pmremGenerator.fromEquirectangular是替代产品，但我不确定。

这是我的代码，该代码加载等角图像并将其转换为立方体贴图，然后将其用作背景。可以使用renderer.toneMappingExposure设置曝光，该功能在r112中有效。请注意，这是模块版本。

new RGBELoader()
.setDataType(THREE.UnsignedByteType)
.load('filename.hdr', (hdrEquiRect, textureData) => {
        hdrCubeRenderTarget = pmremGenerator.fromEquirectangular(hdrEquiRect);
        pmremGenerator.compileCubemapShader();

        scene.background = hdrCubeRenderTarget.texture;

        renderer.toneMappingExposure = 0.5;
});

此示例使用renderer.toneMappingExposure来调整HDRi背景的曝光：

https://threejs.org/examples/?q=hdr#webgl_materials_envmaps_hdr

THREE.RGBELoader（）HDR曝光不会改变

1 个答案: