Руководство по обнаружению ориентиров для веб-сайтов

Задача MediaPipe Pose Landmarker позволяет обнаруживать ориентиры человеческого тела на изображении или видео. Вы можете использовать эту задачу для определения ключевых точек тела, анализа осанки и классификации движений. В задаче используются модели машинного обучения (ML), работающие с отдельными изображениями или видео. Задача выдает ориентиры позы тела в координатах изображения и в трехмерных мировых координатах.

В этих инструкциях показано, как использовать Pose Landmarker для веб-приложений и приложений на JavaScript. Для получения дополнительной информации о возможностях, моделях и параметрах конфигурации этой задачи см. раздел «Обзор» .

Пример кода

Пример кода для Pose Landmarker представляет собой полную реализацию этой задачи на JavaScript для вашего ознакомления. Этот код поможет вам протестировать задачу и начать создавать собственное приложение для определения местоположения позы. Вы можете просматривать, запускать и редактировать пример Pose Landmarker, используя только веб-браузер.

Настраивать

В этом разделе описаны ключевые шаги по настройке среды разработки специально для использования Pose Landmarker. Общую информацию о настройке среды разработки веб-приложений и JavaScript, включая требования к версиям платформы, см. в руководстве по настройке веб-приложений .

пакеты JavaScript

Код Pose Landmarker доступен через NPM- пакет MediaPipe @mediapipe/tasks-vision . Вы можете найти и загрузить эти библиотеки, следуя инструкциям в руководстве по настройке платформы.

Необходимые пакеты можно установить через NPM, используя следующую команду:

npm install @mediapipe/tasks-vision

Если вы хотите импортировать код задачи через службу сети доставки контента (CDN), добавьте следующий код в тег <head> вашего HTML-файла:

<!-- You can replace JSDeliver with another CDN if you prefer -->
<head>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision/vision_bundle.mjs"
    crossorigin="anonymous"></script>
</head>

Модель

Для задачи MediaPipe Pose Landmarker требуется обученная модель, совместимая с этой задачей. Дополнительную информацию о доступных обученных моделях для Pose Landmarker см. в разделе «Модели» обзора задачи.

Выберите и скачайте модель, а затем сохраните её в каталоге вашего проекта:

<dev-project-root>/app/shared/models/

Создайте задачу

Используйте одну из функций Pose Landmarker createFrom...() для подготовки задачи к выполнению выводов. Используйте функцию createFromModelPath() с относительным или абсолютным путем к файлу обученной модели. Если ваша модель уже загружена в память, вы можете использовать метод createFromModelBuffer() .

Приведённый ниже пример кода демонстрирует использование функции createFromOptions() для настройки задачи. Функция createFromOptions() позволяет настраивать маркер положения с помощью параметров конфигурации. Для получения дополнительной информации о параметрах конфигурации см. раздел «Параметры конфигурации» .

Приведенный ниже код демонстрирует, как создать и настроить задачу с пользовательскими параметрами:

const vision = await FilesetResolver.forVisionTasks(
  // path/to/wasm/root
  "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@latest/wasm"
);
const poseLandmarker = await poseLandmarker.createFromOptions(
    vision,
    {
      baseOptions: {
        modelAssetPath: "path/to/model"
      },
      runningMode: runningMode
    });

Параметры конфигурации

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

Название варианта Описание Диапазон значений Значение по умолчанию
runningMode Задает режим выполнения задачи. Доступны два режима:

ИЗОБРАЖЕНИЕ: Режим для ввода одного изображения.

ВИДЕО: Режим декодирования кадров видео или потока входных данных в реальном времени, например, с камеры.		 { IMAGE, VIDEO } IMAGE
numPoses Максимальное количество поз, которые могут быть обнаружены маркером позы. Integer > 0 1
minPoseDetectionConfidence Минимальный показатель достоверности, при котором определение позы считается успешным. Float [0.0,1.0] 0.5
minPosePresenceConfidence Минимальный показатель достоверности наличия позы при обнаружении ориентиров позы. Float [0.0,1.0] 0.5
minTrackingConfidence Минимальный показатель достоверности, при котором отслеживание позы считается успешным. Float [0.0,1.0] 0.5
outputSegmentationMasks Определяет, выводит ли Pose Landmarker маску сегментации для обнаруженной позы. Boolean False

Подготовка данных

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

Запустите задачу

Функция Pose Landmarker использует методы detect() (в режиме выполнения IMAGE ) и detectForVideo() (в режиме выполнения VIDEO ) для запуска процесса определения местоположения. Задача обрабатывает данные, пытается определить местоположение объектов в зависимости от позы, а затем сообщает о результатах.

Вызовы методов detect() и detectForVideo() объекта Pose Landmarker выполняются синхронно и блокируют поток, используемый пользователем. Если вы определяете позы в видеокадрах с камеры устройства, каждое определение блокирует основной поток. Этого можно избежать, реализовав веб-воркеры, которые будут запускать методы detect() и detectForVideo() в другом потоке.

Следующий код демонстрирует, как выполнить обработку с использованием модели задач:

Изображение 

const image = document.getElementById("image") as HTMLImageElement;
const poseLandmarkerResult = poseLandmarker.detect(image);

Видео 

await poseLandmarker.setOptions({ runningMode: "VIDEO" });

let lastVideoTime = -1;
function renderLoop(): void {
  const video = document.getElementById("video");

  if (video.currentTime !== lastVideoTime) {
    const poseLandmarkerResult = poseLandmarker.detectForVideo(video);
    processResults(detections);
    lastVideoTime = video.currentTime;
  }

  requestAnimationFrame(() => {
    renderLoop();
  });
}

Более подробную информацию о реализации задачи Pose Landmarker см. в примере .

Обработка и отображение результатов

Объект Pose Landmarker возвращает объект poseLandmarkerResult для каждого запуска обнаружения. Объект результата содержит координаты для каждого ориентира позы.

Ниже приведён пример выходных данных, полученных в результате выполнения этой задачи:

PoseLandmarkerResult:
  Landmarks:
    Landmark #0:
      x            : 0.638852
      y            : 0.671197
      z            : 0.129959
      visibility   : 0.9999997615814209
      presence     : 0.9999984502792358
    Landmark #1:
      x            : 0.634599
      y            : 0.536441
      z            : -0.06984
      visibility   : 0.999909
      presence     : 0.999958
    ... (33 landmarks per pose)
  WorldLandmarks:
    Landmark #0:
      x            : 0.067485
      y            : 0.031084
      z            : 0.055223
      visibility   : 0.9999997615814209
      presence     : 0.9999984502792358
    Landmark #1:
      x            : 0.063209
      y            : -0.00382
      z            : 0.020920
      visibility   : 0.999976
      presence     : 0.999998
    ... (33 world landmarks per pose)
  SegmentationMasks:
    ... (pictured below)

В выходных данных содержатся как нормализованные координаты ( Landmarks ), так и мировые координаты ( WorldLandmarks ) для каждой достопримечательности.

В выходных данных содержатся следующие нормализованные координаты ( Landmarks ):

  • x и y : Координаты ориентиров, нормализованные в диапазоне от 0,0 до 1,0 относительно ширины ( x ) и высоты ( y ) изображения.

  • z : Глубина опорной точки, при этом за начало координат принимается глубина в середине тазобедренных суставов. Чем меньше значение, тем ближе опорная точка к камере. Величина z примерно соответствует масштабу x .

  • visibility : Вероятность того, что ориентир будет виден на изображении.

В выходных данных содержатся следующие мировые координаты ( WorldLandmarks ):

  • x , y и z : Трехмерные координаты реального мира в метрах, начало координат — середина таза.

  • visibility : Вероятность того, что ориентир будет виден на изображении.

На следующем изображении представлена ​​визуализация результатов выполнения задачи:

Женщина в медитативной позе. Ее поза подчеркнута каркасной моделью, указывающей на положение конечностей и туловища.

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

Маска сегментации предыдущего изображения, которая обрисовывает контуры женщины.

Пример кода Pose Landmarker демонстрирует, как отобразить результаты, полученные в ходе выполнения задачи (см. пример) .