LightProbe и освещение на основе окружения (IBL)

LightProbe в Three.js используется для реализации реалистичного освещения сцены на основе данных о световой среде. Этот тип освещения позволяет объектам реагировать на окружающее световое поле, создавая эффект, приближенный к физически корректному.

LightProbe фиксирует информацию о световой среде в виде сферы коэффициентов сферической гармоники (Spherical Harmonics, SH). Эти коэффициенты кодируют распределение света с разных направлений, что обеспечивает мягкое, диффузное освещение, без необходимости устанавливать отдельные источники света для каждой области сцены.

Создание и использование LightProbe

import * as THREE from 'three';

// Создание LightProbe
const lightProbe = new THREE.LightProbe();

// Настройка сферической гармоники вручную (пример)
lightProbe.sh.fromArray([
  0.8, 0.7, 0.6,  // L00
  0.1, 0.1, 0.1,  // L1-1
  0.2, 0.2, 0.2,  // L10
  0.3, 0.3, 0.3   // L11
]);

scene.add(lightProbe);

Ключевые моменты:

  • LightProbe.sh хранит коэффициенты SH, которые интерпретируют световое окружение.
  • LightProbe не создает видимого источника света, он работает только через отражение и рассеянный свет.
  • Он особенно эффективен для статических сцен или объектов, освещаемых HDRI-картами.

Связь с Environment Map (HDRI) и IBL

Освещение на основе окружения (Image-Based Lighting, IBL) позволяет сцене реагировать на изображения окружающей среды. В Three.js используется CubeTexture или HDR-карты в формате .hdr или .exr. Эти текстуры могут быть преобразованы в LightProbe с помощью LightProbeGenerator.fromCubeTexture().

import { LightProbeGenerator } from 'three/examples/jsm/lights/LightProbeGenerator.js';
import { RGBELoader } from 'three/examples/jsm/loaders/RGBELoader.js';

new RGBELoader().load('path/to/hdr.hdr', function(texture) {
    texture.mapping = THREE.EquirectangularReflectionMapping;

    // Генерация LightProbe из HDR-карты
    const lightProbe = LightProbeGenerator.fromCubeTexture(texture);
    scene.add(lightProbe);

    // Присвоение HDR-карты как environment для сцены
    scene.environment = texture;
});

Особенности:

  • scene.environment используется материалами MeshStandardMaterial и MeshPhysicalMaterial для отражений и диффузного освещения.
  • HDR-текстура с высокой динамикой сохраняет детализацию освещения в тёмных и ярких участках.
  • LightProbe преобразует глобальное освещение в SH-коэффициенты, что оптимизирует производительность.

Интеграция с PBR-материалами

Материалы PBR (Physically Based Rendering) в Three.js используют диффузное освещение, отражения и F0-параметры металличности. LightProbe обеспечивает реалистичное отражение диффузного света на объектах, без необходимости вручную расставлять источники света.

const material = new THREE.MeshStandardMaterial({
    color: 0xffffff,
    metalness: 0.5,
    roughness: 0.3
});

const mesh = new THREE.Mesh(geometry, material);
scene.add(mesh);

Эффект IBL:

  • Диффузное освещение — от LightProbe.
  • Спекулярные отражения — от scene.environment.
  • Совместно создают реалистичную сцену с минимальными настройками.

Обновление освещения динамически

Для динамических сцен можно обновлять LightProbe в реальном времени. Например, при изменении HDRI или позиционировании объекта относительно источников света.

// Обновление LightProbe при смене окружающей карты
lightProbe.sh.fromArray(newSHCoefficients);

Замечания по производительности:

  • SH-коэффициенты вычисляются один раз и применяются ко всем объектам с PBR-материалами.
  • Динамическое обновление LightProbe лучше ограничивать редкими изменениями, чтобы избежать лишней нагрузки на GPU.

Практические советы

  1. Использовать HDRI высокого качества — это обеспечивает реалистичное распределение света.
  2. Совмещать LightProbe с DirectionalLight или SpotLight — для драматического контраста и теней.
  3. Для объектов, требующих точных отражений, применять scene.environment вместе с IBL, так как LightProbe отражает только диффузный компонент.
  4. Минимизировать количество LightProbe, если сцена большая, так как каждый LightProbe добавляет вычислительные накладные расходы.

Взаимодействие с другими типами света

  • AmbientLight — общий фон, может сочетаться с LightProbe для базового освещения.
  • DirectionalLight и PointLight — создают локальные тени и направленный свет, дополняя глобальное освещение от LightProbe.
  • HemisphereLight — обеспечивает градиентное освещение сверху/снизу, может дублировать эффект LightProbe, но без точного отражения окружающей среды.

LightProbe и IBL в Three.js создают основу для реалистичного PBR-рендеринга, где свет не моделируется вручную, а берется из реальной среды, что упрощает создание сложных и естественных сцен.

Оглавление