EventDispatcher →

App

Класс App позволяет упростить настройку 3Д-приложения. Он включает код для инициализации ВебГЛ рендерера, загрузки ГЛТФ сцен, автоматического запуска анимации, а также логику для основных элементов управления камерой.

Пример


    // загружаемый ГЛТФ-ассет
    const url = 'template.gltf';

    // создать приложение с простым крутящимся прелоадером
    const app = new v3d.App('v3d-container', null, new v3d.SimplePreloader({ container: 'v3d-container' }));

    // загрузить главную сцену
    app.loadScene(url, function() {
        app.enableControls();
        app.run();
        runCode();
    });

    function runCode() {
        // поместите ваш код здесь
    }

Конструктор

App(container, ctxSettings, preloader)

container - идентификатор ХТМЛ-элемента или сам ХТМЛ-элемент для размещения канваса.
ctxSettings - атрибуты контекста ВебГЛ, которые должны быть переданы в методе canvas.getContext() .
preloader - экземпляр класса Preloader приложения.

Этот конструктор делает следующее:

Создает новый элемент контейнера (если необходимо).
Проверяет, поддерживается ли технология ВебГЛ, если нет, выводит диалог об ошибке.
Инициализирует часы приложения.
Создает новый 3D canvas с контекстом ВебГЛ 1.0 или ВебГЛ 2.0 и добавляет его к элементу контейнера.
Инициализирует загрузчик ГЛТФ.
Добавляет экземпляр приложения в список v3d.apps (в случае немодулированного движка).

Свойства

# .actions : Array

Массив animation actions, используемых для планирования анимаций приложения. Вместо прямого доступа к этому списку можно также использовать метод getAnimationActionByName для поиска действия по имени клипа.

# .clearBkgOnLoad : Boolean

Устанавливает фон сцены на null после загрузки сцены ГЛТФ. По умолчанию false.

# .container : HTMLElement

Элемент контейнера. Это родительский элемент для 3D Canvas, используемый для операций рендеринга.

# .scene : Scene

Главная сцена приложения.

# .camera : Camera

Главная камера приложения.

# .clock : Clock

Объект часов приложения.

# .compileCallbacks : Array

Массив функций, которые будут вызваны непосредственно перед компиляцией шейдера. Компиляция шейдеров происходит во время загрузки сцены, сразу после того, как все ассеты (метаданные ГЛТФ, бинарные файлы, текстуры) были получены.

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



    function initFog(appInstance) {
        appInstance.scene.fog = new v3d.FogExp2('green', 0.01);
    }

    // загружаемый ГЛТФ 2.0 ассет
    const url = 'my_scene.gltf';

    // создать приложение с простым крутящимся прелоадером
    const app = new v3d.App('v3d-container', null, new v3d.SimplePreloader({ container: 'v3d-container' }));

    // инициализировать туман перед загрузкой сцены
    app.compileCallbacks.push(initFog);

    // загрузить главную сцену
    app.loadScene(url, function() {
        app.enableControls();
        app.run();
    });

# .controls : null

Объект управления главной камерой приложения.

# .frame : Number

Текущий кадр рендеринга приложения.

# .frameRateDivider : Number

Делитель FPS приложения. Используйте setFrameDivider для установки этого значения.

# .mixer : AnimationMixer

Микшер, используемый для воспроизведения анимации, загруженной из данных ГЛТФ.

# .preloader : HTMLElement

Элемент предзагрузки приложения (существует только во время загрузки сцены)

# .renderer : WebGLRenderer

Рендерер ВебГЛ приложения.

# .renderCallbacks : Array

Массив функций, которые будут вызываться каждый раз, когда начинается рендеринг.

# .loader : GLTFLoader

Загрузчик ГЛТФ приложения.

# .worldCubemapRes : Number

Разрешение текстуры cubemap, представляющей материал мира. По умолчанию - 1024.

# .worldMaterial : Material

Устаревшее. Вместо этого, используйте Scene.worldMaterial. Это материал, используемый для создания окружения мира.

# .xrControllers : Array

Массив объектов контроллера для активной сессии WebXR.

# .xrSession : XRSession

Активная сессия WebXR.

Методы

# .animate() → null

Обработчик обновлений сцены: рендеринга, анимации и управления камерой. Не стоит вносить изменения, если не знаете за что отвечают эти параметры.

# .appendScene(url, loadCb, progressCb, errorCb, loadCameras, loadLights) → null

Добавляет сцену из указанного файла ГЛТФ к текущей сцене. loadCb получит загруженную сцену в качестве параметра после завершения загрузки.

Если в приложении нет активной сцены, то ничего не будет добавлено.

Такие параметры, как loadCameras и loadLights, используются для указания того, будут ли камеры и освещение добавлены из загруженной сцены. По умолчанию оба параметра имеют значение true.

# .cleanup() → null

Устаревший. Вместо этого используйте dispose или unload.

# .disablePostprocessing(keepOutline) → null

Отключить все эффекты постобработки (кроме контура, когда keepOutline=true).

# .disableRendering(after) → null

Отключает обновление графики в цикле анимации после заданного количества кадров (укажите 0, чтобы отключить сразу). Элементы управления и микшер анимации будут продолжать обновляться, а обратные вызовы рендеринга - вызываться.

# .disableSSAA() → null

Отключить сглаживание.

# .dispose() → null

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

После утилизации приложение больше не может использоваться. Этот способ лучше всего подходит для случаев, когда требуется полная очистка.

# .enableControls() → null

Включает элементы управления для главной камеры приложения. В зависимости от типа управления, указанного для камеры, этот метод предоставит вам 'ORBIT', 'FLYING' или статичную камеру.

# .enablePostprocessing(effects) → null

Включает заданные эффекты постобработки.

# .enableRendering() → null

Включает обновление графики в цикле анимации.

# .enableSSAA(sampleLevel, iterative) → null

Включить сглаживание. Количество выборок рассчитывается как 2^sampleLevel (например, укажите 4, чтобы включить 16x SSAA).

# .getCamera() → Camera

Возвращает главную камеру приложения.

# .getHeight() → number

Возвращает рассчитанную высоту элемента контейнера.

# .getWidth() → number

Возвращает рассчитанную ширину элемента контейнера.

# .hideFPS() → null

Скрывает счетчик частоты кадров.

# .load(url, loadOkCb, loadErrorCb, autoStart) → null

Устаревший. Вместо этого используйте loadScene.

Загрузите сцену ГЛТФ. Обратный вызов loadOkCb получит загруженную сцену в качестве параметра после завершения загрузки.

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

# .loadScene(url, loadCb, progressCb, errorCb) → null

Загружает сцену ГЛТФ. Обратный вызов loadCb получит загруженную сцену в качестве параметра после завершения загрузки.

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

# .onResize() → null

Обработчик события изменения размера canvas. Не изменяйте его, если не знаете, что делаете.

# .printPerformanceInfo(delta) → null

Оценивает и распечатывает профиль производительности рендеринга. delta - опциональный период оценки (по умолчанию 1).

# .render() → null

Обработчик для рендеринга сцены. Не изменяйте его, если не знаете, что делаете.

# .run() → null

Запускает приложение, удаляя прелоадер и запуская цикл рендеринга.

# .setFrameRateDivider(divider : Integer) → null

Уменьшает максимальный кадр, деля его на заданное целое число. По умолчанию движок пытается рендерить сцены со скоростью 60 кадров в секунду. Если делитель установлен, например, на 2, FPS будет снижен до 30.

# .showFPS() → null

Показать счетчик частоты кадров.

# .unload(rootObj) → null

rootObj — (опционально) объект для выгрузки вместе с его дочерними объектами; если объект не задан или заданный объект является основной сценой приложения, то метод выполняет полную очистку сцены.

Выгружает либо часть, либо всю сцену в зависимости от параметров.

Если заданный rootObj является одним из объектов сцены, то этот метод удаляет данный объект и его преемников из сцены, а также освобождает связанные с ним ресурсы (геометрии, материалы, текстуры и т.д...). Если данный rootObj является самим экземпляром сцены, то этот метод выполняет полную очистку сцены, которая включает удаление всех объектов, окружения сцены, камер и элементов управления камерами, анимации, постпроцессинга, внутренних объектов ВебГЛ и т.д....

После того как сцена приложения была полностью выгружена, метод loadScene может быть использован для загрузки совершенно новой сцены. Этот подход лучше всего подходит для загрузки/выгрузки нескольких сцен без выгрузки всего приложения.

# .updateEnvironment(wMat) → null

Обновление окружения мира из указанного материала. Такой материал обычно хранится в свойстве Scene.worldMaterial.

# .updateEnvMapProbes(object3d) → null

object3d - объект или сцена для поиска объектов-зондов среди его преемников.

Обновить все объекты CubeReflectionProbe, которые являются преемниками данного объекта object3d.

Исходный файл

О том как получить исходный код этого модуля читайте тут.