Материал однотонных цветов выгорает при использовании THREE.ACESFilmicToneMapping - PullRequest
Новая
       90

Материал однотонных цветов выгорает при использовании THREE.ACESFilmicToneMapping

0 голосов
/ 05 августа 2020

Мы обновляем настройку нашего приложения three. js, чтобы оно использовало THREE.ACESFilmicToneMapping (потому что наша сцена использует IBL из карты среды EXR).

В этом процессе материалы, использующие текстуры, теперь отлично выглядит (цвета карты были размыты перед изменением, как показано ниже).

с renderer.toneMapping = THREE.LinearToneMapping (по умолчанию)

with renderer.toneMapping = THREE.ACESFilmicToneMapping

However, the problem is that plain colours (without any maps) are now looking burnt...

with renderer.toneMapping = THREE.LinearToneMapping (default)

with renderer.toneMapping = THREE.ACESFilmicToneMapping

It's now totally impossible to get bright yellow or green for example. Turning down the renderer.toneMappingExposure or the material.envMapIntensity can help, but materials with textures then get way too dark... Ie. provided any given parameter, material using plain colours are either too bright, or material using textures are too dark.

I'm not sure if I am missing something, but this looks like there would be an issue in this setup. Would there be any other parameter that we are overlooking that is causing this result?

Otherwise, we are loading all our models using the GLTFLoader, and we have renderer.outputEncoding = THREE.sRGBEncoding; as per the documentation of the GLTFLoader. Our environment map is an equirectangular EXR loaded with EXRLoader:

import { EXRLoader } from 'three/examples/jsm/loaders/EXRLoader';

const envMapLoader = new EXRLoader();
envMapLoader.load(
  environmentMapUrl,
  rawTexture => {
    const pmremGenerator = new THREE.PMREMGenerator(renderer);
    pmremGenerator.compileEquirectangularShader();
    const envMapTarget = pmremGenerator.fromEquirectangular(rawTexture);
    const { texture } = envMapTarget;
    return texture;
  },
  ...
)
...