Fog настройки

Объект Scene.fog и его роль в рендеринге

В CesiumJS туман (fog) является частью графического конвейера сцены и управляется через объект scene.fog. Он отвечает за имитацию атмосферного затухания объектов с увеличением расстояния до камеры, создавая эффект глубины и естественного исчезновения удалённых элементов.

Fog применяется ко всем визуализируемым примитивам сцены, включая тайлы террейна, 3D Tiles и геометрию. Основная цель — снижение визуальной перегруженности дальних объектов и улучшение восприятия масштаба глобальной сцены.

Доступ к настройкам осуществляется через:

const viewer = new Cesium.Viewer("cesiumContainer");

const fog = viewer.scene.fog;

Включение и отключение тумана

Базовая настройка управления эффектом осуществляется через флаг enabled.

viewer.scene.fog.enabled = true;

При отключении тумана сцена визуализируется без атмосферного затухания, и дальние объекты сохраняют полную контрастность независимо от расстояния.

viewer.scene.fog.enabled = false;

Флаг enabled часто используется в комбинации с переключением режимов визуализации, например при отладке или сравнении качества рендера.


Плотность тумана (density) и её влияние

Ключевым параметром является density, определяющий интенсивность затухания.

viewer.scene.fog.density = 0.0002;

Чем выше значение плотности, тем быстрее объекты теряют видимость при удалении от камеры. Низкие значения создают мягкий атмосферный переход, характерный для глобальных карт и высокодетализированных сцен.

Поведение можно описать как экспоненциальное затухание: каждый дополнительный метр расстояния уменьшает видимую яркость объектов по нелинейной кривой.

Практическая интерпретация:

  • очень малые значения (~0.00005) — почти незаметный эффект
  • средние (~0.0002 – 0.0005) — стандартная глобальная сцена
  • высокие (>0.001) — выраженный «дымчатый» эффект с быстрым исчезновением дальних объектов

Влияние тумана на восприятие глубины сцены

Fog в CesiumJS играет не только декоративную роль, но и решает задачу визуальной иерархии:

  • снижает визуальный шум в горизонте
  • уменьшает конфликт деталей на больших расстояниях
  • усиливает ощущение масштаба планеты
  • помогает отделять ближнюю и дальнюю геометрию

Особенно заметно это при работе с 3D Tiles, где плотные городские модели могут перегружать дальний план без атмосферного затухания.


Screen Space Error Factor и связь с Fog

Внутренняя работа тумана связана с уровнем детализации тайлов через параметр screenSpaceErrorFactor.

viewer.scene.fog.screenSpaceErrorFactor = 2.0;

Этот параметр влияет на то, как агрессивно Cesium будет упрощать геометрию при увеличении расстояния и как быстро fog начнёт маскировать низкодетализированные области.

Увеличение значения приводит к:

  • более раннему появлению тумана на объектах
  • ускоренному переходу к упрощённым LOD-уровням
  • снижению нагрузки на рендеринг дальних областей

Взаимодействие Fog с камерой

Fog тесно связан с положением камеры. При изменении высоты наблюдателя меняется и визуальная плотность эффекта.

При низкой высоте камеры:

  • туман влияет преимущественно на горизонт
  • объекты среднего расстояния остаются чёткими

При высокой орбите:

  • эффект охватывает значительную часть земного диска
  • граница видимости становится мягкой и протяжённой

Это поведение особенно важно при переходе между режимами:

  • наземный просмотр (street-level)
  • глобальный обзор (globe view)
  • космическая перспектива

Динамическая настройка плотности

Параметр density может изменяться в зависимости от масштаба сцены или высоты камеры.

const scene = viewer.scene;

viewer.camera.changed.addEventListener(() => {
    const height = Cesium.Cartographic.fromCartesian(
        viewer.camera.position
    ).height;

    if (height < 1000) {
        scene.fog.density = 0.0001;
    } else if (height < 100000) {
        scene.fog.density = 0.0002;
    } else {
        scene.fog.density = 0.0005;
    }
});

Такой подход позволяет поддерживать визуальную консистентность между разными уровнями приближения, избегая резких переходов видимости объектов.


Ограничения и особенности рендеринга

Fog в CesiumJS имеет несколько характерных особенностей, связанных с WebGL-рендерингом:

  • эффект зависит от глубины сцены и буфера глубины
  • не является постобработкой, а встроен в шейдеры
  • может по-разному проявляться на разных типах геометрии
  • не всегда одинаково влияет на прозрачные материалы

Также fog не заменяет атмосферное рассеяние (SkyAtmosphere), а работает совместно с ним, формируя более сложную модель визуальной среды.


Цвет и визуальная интеграция с атмосферой

Хотя основной параметр fog — это плотность, его визуальный результат тесно связан с цветом сцены и атмосферными эффектами. В CesiumJS туман обычно визуально сливается с цветом неба и горизонта, создавая непрерывный переход между землёй и атмосферой.

При изменении времени суток (если включены соответствующие эффекты освещения) восприятие fog также меняется:

  • дневное освещение делает туман более прозрачным
  • сумерки усиливают его визуальную плотность
  • ночной режим повышает контраст между ближними и дальними объектами

Практическое влияние на производительность

Несмотря на то что fog в первую очередь визуальный эффект, он косвенно влияет на производительность:

  • снижает необходимость рендеринга мелких деталей на дальних дистанциях
  • улучшает восприятие LOD-переходов
  • уменьшает визуальную нагрузку, связанную с большим количеством объектов

При больших сценах с 3D Tiles корректно настроенный fog помогает добиться более стабильного ощущения плавности без перегрузки GPU.


Типовые паттерны настройки

В реальных конфигурациях CesiumJS fog часто настраивается по сценарию использования:

Глобальная карта

viewer.scene.fog.density = 0.0002;
viewer.scene.fog.enabled = true;

Архитектурная визуализация города

viewer.scene.fog.density = 0.0004;
viewer.scene.fog.screenSpaceErrorFactor = 1.5;

Отладочный режим

viewer.scene.fog.enabled = false;