THREE.RGBELoader()HDR曝光不变

问题描述 投票:0回答:1

我想使用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库不存在。

three.js hdr
1个回答
0
投票

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

自您提出此问题以来,与环境图有关的功能似乎已发生了重大变化。例如,THREE.EquirectangularToCubeGenerator显然不再存在。看来pmremGenerator.fromEquirectangular是要替换的,但我不确定。

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

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

        scene.background = hdrCubeRenderTarget.texture;

        hdrCubeRenderTarget.mapping = THREE.CubeRefractionMapping;
        renderer.toneMappingExposure = 0.5;
});

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

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

© www.soinside.com 2019 - 2024. All rights reserved.