0

我想用兄弟。

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)

上面的代码结果很好地显示了修改后的值。但是立方体贴图的曝光并没有改变。

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

4

1 回答 1

1

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

自从您提出这个问题以来,与环境贴图相关的功能似乎发生了重大变化。例如,THREE.EquirectangularToCubeGenerator显然不再存在。它看起来像是pmremGenerator.fromEquirectangular打算作为替代品,但我不完全确定。

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

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

        scene.background = hdrCubeRenderTarget.texture;
        renderer.toneMapping = LinearToneMapping;
        renderer.toneMappingExposure = 0.5;
});

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

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

编辑 - 因为 r116 你还需要设置renderer.toneMappingLinearToneMapping1

于 2020-01-09T14:24:21.507 回答