Plane Detection и Anchor System

Babylon.js предоставляет мощный инструментарий для работы с дополненной реальностью (AR), включая обнаружение плоскостей (plane detection). Этот механизм используется для определения горизонтальных и вертикальных поверхностей в реальном пространстве, что позволяет размещать на них виртуальные объекты.

Обнаружение плоскостей основывается на данных сенсоров устройства, включая камеру и акселерометр. Babylon.js взаимодействует с WebXR API, чтобы получать обновления о пространственных поверхностях. Для активации функции необходимо использовать XRSession с поддержкой plane-detection.

const xr = await scene.createDefaultXRExperienceAsync({ 
    uiOptions: { sessionMode: "immersive-ar" },
    optionalFeatures: ["plane-detection"]
});

Ключевые моменты при работе с plane detection:

  • Типы плоскостей: горизонтальные (пол, стол), вертикальные (стены, двери), произвольные (наклонные поверхности).
  • Обновление данных: Babylon.js предоставляет события onPlaneAddedObservable, onPlaneUpdatedObservable, onPlaneRemovedObservable, что позволяет отслеживать появление и изменения плоскостей в реальном времени.
  • Свойства плоскости: каждая плоскость имеет уникальный id, положение position, ориентацию rotationQuaternion и размеры extents.
xr.baseExperience.featuresManager.enableFeature(BABYLON.WebXRPlaneDetector, "latest")
    .onPlaneAddedObservable.add((plane) => {
        console.log("Плоскость обнаружена:", plane.id);
    });

Anchor System: закрепление объектов в пространстве

Anchor System позволяет привязать виртуальные объекты к конкретной позиции в AR-сцене, даже если устройство перемещается. В Babylon.js это реализуется через WebXRAnchorSystem. Является основой для стабильного отображения объектов на обнаруженных плоскостях.

Создание якоря:

const anchorSystem = xr.baseExperience.featuresManager.enableFeature(
    BABYLON.WebXRAnchorSystem, "latest"
);

const anchor = await anchorSystem.addAnchorAtPositionAndRotation(
    new BABYLON.Vector3(0, 0, -1),
    BABYLON.Quaternion.Identity()
);

const box = BABYLON.MeshBuilder.CreateBox("box", { size: 0.1 }, scene);
anchor.attachedNode = box;

Особенности работы с якорями:

  • Привязка к плоскости: якорь можно создавать на основе позиции обнаруженной плоскости, что обеспечивает точное размещение объекта.
  • Обновление позиции: если плоскость корректируется системой, якорь автоматически подстраивает положение attachedNode.
  • Удаление якоря: вызов anchorSystem.removeAnchor(anchor) позволяет безопасно удалить привязку и освободить ресурсы.

Интеграция Plane Detection и Anchor System

Эффективное использование AR-сцены требует совместной работы обнаружения плоскостей и системы якорей. Логика обычно строится следующим образом:

  1. Обнаружение плоскости — событие onPlaneAddedObservable.
  2. Создание якоря на плоскости — привязка позиции и ориентации объекта к обнаруженной поверхности.
  3. Отслеживание изменений — события onPlaneUpdatedObservable корректируют якорь при изменении формы плоскости.
  4. Удаление плоскости — onPlaneRemovedObservable освобождает якорь, чтобы не оставлять “висячие” объекты.

Пример интеграции:

xr.baseExperience.featuresManager.enableFeature(BABYLON.WebXRPlaneDetector, "latest")
    .onPlaneAddedObservable.add(async (plane) => {
        const anchor = await anchorSystem.addAnchorAtPositionAndRotation(
            plane.position,
            plane.rotationQuaternion
        );

        const sphere = BABYLON.MeshBuilder.CreateSphere("sphere", { diameter: 0.1 }, scene);
        anchor.attachedNode = sphere;
    });

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

  • Для стабильной работы AR следует использовать малые объёмы геометрии объектов и избегать сложных вычислений в реальном времени.
  • Фильтрация плоскостей: можно игнорировать вертикальные или слишком маленькие плоскости, чтобы не создавать лишние якоря.
  • Оптимизация обновлений: подписка на onPlaneUpdatedObservable должна ограничиваться лишь нужными плоскостями, иначе производительность сцены падает.
  • Совместимость устройств: проверять поддержку plane-detection и anchors через xr.baseExperience.sessionManager.features.

Расширенные возможности

  • Комбинация с hit-test: позволяет размещать объекты на месте, куда указывает пользователь, используя обнаруженные плоскости для корректного позиционирования.
  • Сценарии динамических объектов: можно перемещать или анимировать объекты, прикрепленные к якорям, сохраняя их связь с реальным пространством.
  • События жизненного цикла: onAnchorAddedObservable, onAnchorRemovedObservable позволяют создавать сложные интерактивные AR-приложения с реакцией на изменения сцены.

Использование plane detection совместно с Anchor System формирует фундамент для создания устойчивых и интерактивных AR-сцен в Babylon.js, позволяя виртуальным объектам точно интегрироваться в реальное пространство.

Оглавление