CesiumJS построена вокруг сцены, в которой каждый визуальный элемент существует не изолированно, а в составе многослойной композиции. Рендеринг глобуса формируется через наложение нескольких независимых слоёв данных, проходящих через общий граф отрисовки WebGL, где итоговое изображение является результатом строгого порядка смешивания, глубинного тестирования и постобработки.
В основе визуальной модели CesiumJS лежит сцена (Scene),
которая координирует несколько параллельных систем:
Каждая система не просто добавляется в сцену, а участвует в едином конвейере рендеринга, где порядок выполнения и правила смешивания определяют итоговую визуальную композицию.
Ключевой принцип — отсутствие «плоского» Z-слоя в классическом UI-смысле. Вместо этого используется комбинация:
Самый фундаментальный уровень визуальной многослойности — это набор
слоёв изображений, управляемых через
ImageryLayerCollection.
Каждый слой представляет собой источник растровых тайлов:
Слои накладываются друг на друга по порядку добавления, но итоговое отображение зависит от параметров смешивания:
Каждый пиксель итогового изображения формируется как результат композиции:
При этом imagery не является плоской текстурой: тайлы подгружаются динамически в зависимости от уровня детализации (LOD), и каждый уровень может частично перекрывать предыдущий.
Внутренний граф отрисовки CesiumJS разделяет объекты по категориям:
Порядок важен, поскольку WebGL не выполняет автоматическую семантическую сортировку объектов. Вместо этого CesiumJS использует собственную систему:
Глобус и imagery формируют базовый слой, поверх которого накладываются все остальные сущности сцены.
Прозрачность в CesiumJS — это не только визуальный параметр, но и механизм управления порядком смешивания.
Основные режимы:
При наложении нескольких прозрачных слоёв возникает проблема порядка (order dependency). CesiumJS частично решает её через:
Особенно сложным является случай, когда прозрачные imagery layers пересекаются с полупрозрачной геометрией 3D Tiles. В таких ситуациях итоговый цвет пикселя определяется последовательностью проходов рендера, а не только геометрической глубиной.
Рельеф (terrain) формирует геометрическую основу сцены. Он задаёт:
Imagery накладывается поверх terrain как текстурный слой, но с учётом:
3D Tiles добавляют третий уровень композиции — объёмные данные:
Важная особенность — 3D Tiles могут:
Таким образом формируется трёхслойная система:
Каждый слой не заменяет предыдущий, а дополняет его в общем буфере глубины.
После завершения основного рендеринга сцены запускается pipeline
постобработки (PostProcessStageCollection).
Типовые эффекты:
Постобработка работает на уровне полноэкранных фрагментных шейдеров, используя результат предыдущего рендера как текстуру.
Ключевая особенность — постобработка не знает о семантике сцены. Она оперирует только:
Это создаёт дополнительный слой композитинга, который накладывается поверх уже собранной сцены.
Отдельный уровень многослойности формируется через механизмы classification и clipping.
Classification позволяет:
Классификаторы работают как «невидимые» геометрические маски, влияющие на итоговый цвет пикселей.
Clipping planes вводят геометрическое ограничение:
Эти механизмы не добавляют новые объекты, но изменяют способ композитинга уже существующих.
В отличие от классических 2D-систем, где слой = индекс в списке, в CesiumJS многослойность распределена по нескольким уровням:
Важную роль играет не только порядок добавления, но и тип материала:
Иерархия формируется динамически в зависимости от положения камеры, LOD и состояния кэша тайлов.
Вся система построена поверх WebGL, где отсутствует встроенная модель сценического графа высокого уровня.
CesiumJS добавляет собственный слой абстракции:
Композитинг реализуется через последовательные проходы:
Каждый проход может изменять или дополнять буфер изображения, формируя итоговую сцену как результат сложной композиции.
Многослойная архитектура требует строгого контроля ресурсов:
Оптимизация достигается через:
Модель рендеринга остаётся стабильной только при контролируемом количестве активных слоёв и предсказуемой глубине сцены.