Texture Inspector

Texture Inspector — инструмент для детального анализа и отладки текстур в сценах Babylon.js. Он позволяет визуализировать текстуры, их каналы, параметры фильтрации и MIP-уровни, что особенно важно при работе с высокодетализированными 3D-сценами и сложными материалами.

Подключение Texture Inspector

Для использования Texture Inspector необходимо подключить основной скрипт Babylon.js и соответствующие инструменты отладки:

import * as BABYLON from 'babylonjs';
import 'babylonjs-inspector';

Inspector включается на сцене следующим образом:

const engine = new BABYLON.Engine(canvas, true);
const scene = new BABYLON.Scene(engine);

scene.debugLayer.show({
    embedMode: true
});

Опция embedMode: true позволяет отображать панель инспектора прямо внутри страницы без необходимости отдельного окна.

Основные возможности Texture Inspector

  1. Просмотр текстур и каналов Texture Inspector отображает все текстуры, используемые в материалах сцены. Каждая текстура может быть рассмотрена по отдельности:

    • Diffuse (Albedo) – базовая окраска поверхности.
    • Specular – отражательные свойства.
    • Normal – карта нормалей для имитации микрорельефа.
    • Emissive – источники свечения на поверхности.
    • Opacity – прозрачность.

    Для каждой текстуры можно переключаться между RGB-каналами и Alpha-каналом, что упрощает отладку корректности карт.

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

  3. Проверка фильтрации и адресации текстур В Babylon.js доступны различные типы фильтрации (Bilinear, Trilinear, Anisotropic) и режимы адресации (Wrap, Clamp, Mirror). Texture Inspector визуализирует эти параметры, показывая, как текстура обрабатывается движком на практике.

  4. Поддержка динамических текстур Динамические текстуры (например, RenderTargetTexture или CanvasTexture) также отображаются в инспекторе. Это позволяет проверять, корректно ли обновляется текстура при изменении сцены или объекта.

Использование в сложных материалах

В материалах PBR (Physically Based Rendering) Texture Inspector особенно полезен для:

  • Анализа карт metallic и roughness, которые определяют физически корректное отражение света.
  • Проверки occlusion map (AO) для правильного затенения мелких деталей.
  • Настройки комбинированных текстур через multi-materials, где каждая текстура влияет на отдельный слой материала.

Работа с производительностью

Texture Inspector позволяет отслеживать размеры текстур, их формат (например, RGB, RGBA, Luminance) и объем видеопамяти, что важно для оптимизации сложных сцен и мобильных приложений. Инспектор также указывает, какие текстуры можно конвертировать в более компактные форматы или уменьшить разрешение без значимой потери качества.

Расширенные функции

  • Live update – автоматически обновляет текстуру в инспекторе при её изменении в сцене.
  • Comparison mode – позволяет сравнивать две текстуры или один и тот же MIP-уровень для выявления изменений.
  • Export – текстуры можно сохранить для последующего анализа или редактирования в графическом редакторе.

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

const sphere = BABYLON.MeshBuilder.CreateSphere("sphere", {diameter: 2}, scene);
const material = new BABYLON.PBRMaterial("pbrMat", scene);

material.albedoTexture = new BABYLON.Texture("textures/wood_diffuse.jpg", scene);
material.metallicTexture = new BABYLON.Texture("textures/wood_metallic.jpg", scene);
material.roughness = 0.5;

sphere.material = material;

// Открытие инспектора для анализа текстур
scene.debugLayer.show({overlay: true});

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

Настройка видимости текстур

Inspector поддерживает фильтры по типу текстур и материалам, что облегчает работу с большим количеством объектов. Например, можно отобразить только динамические текстуры или текстуры PBR-материалов.


Texture Inspector является неотъемлемым инструментом при разработке сложных сцен, оптимизации производительности и точной настройке материалов. Он обеспечивает визуальное подтверждение корректности текстур, упрощает выявление ошибок и позволяет глубоко контролировать параметры текстур в Babylon.js.