Przewodnik wykrywania punktów orientacyjnych pozycji w przeglądarce

Zadanie MediaPipe Pose Landmarker umożliwia wykrywanie punktów orientacyjnych ciała ludzkiego na obrazie lub filmie. Za pomocą tego zadania możesz identyfikować kluczowe części ciała, analizować postawę oraz kategoryzować ruchy. To zadanie korzysta z modeli systemów uczących się, które działają z pojedynczymi obrazami lub filmami. Zadanie wyprowadza punkty orientacyjne postawy ciała w współrzędnych obrazu i w trójwymiarowych współrzędnych świata.

Z tych instrukcji dowiesz się, jak używać narzędzia Pose Landmarker w przypadku aplikacji internetowych i JavaScript. Więcej informacji o możliwościach, modelach i opcjach konfiguracji tego zadania znajdziesz w sekcji Omówienie.

Przykładowy kod

Przykładowy kod dla usługi Pose Landmarker zawiera kompletną implementację tego zadania w JavaScriptzie. Ten kod pomoże Ci przetestować to zadanie i rozpocząć tworzenie własnej aplikacji do oznaczania pozycji. Możesz wyświetlać, uruchamiać i edytować przykładowy kod aplikacji do oznaczania pozycji za pomocą przeglądarki.

Konfiguracja

W tej sekcji opisaliśmy kluczowe kroki konfiguracji środowiska programistycznego, które są niezbędne do korzystania z usługi Pose Landmarker. Ogólne informacje o konfigurowaniu środowiska programowania w sieci i JavaScriptu, w tym wymagania dotyczące wersji platformy, znajdziesz w przewodniku konfiguracji dla sieci.

Pakiety JavaScript

Kod Pose Landmarker jest dostępny w pakiecie @mediapipe/tasks-vision NPM MediaPipe. Aby znaleźć i pobrać te biblioteki, wykonaj instrukcje podane w przewodniku po konfiguracji platformy.

Wymagane pakiety możesz zainstalować za pomocą NPM, używając tego polecenia:

npm install @mediapipe/tasks-vision

Jeśli chcesz zaimportować kod zadania za pomocą usługi sieci dystrybucji treści (CDN), dodaj ten kod w tagu <head> w pliku HTML:

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

Model

Zadanie MediaPipe Pose Landmarker wymaga wytrenowanego modelu, który jest zgodny z tym zadaniem. Więcej informacji o dostępnych wytrenowanych modelach usługi Pose Landmarker znajdziesz w sekcji Modele w omówieniu zadania.

Wybierz i pobierz model, a potem zapisz go w katalogu projektu:

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

Tworzenie zadania

Użyj jednej z funkcji createFrom...() do przetwarzania zadania w celu wykonania wnioskowania. Użyj funkcji createFromModelPath() z ścieżką względną lub bezwzględną do wytrenowanego pliku modelu. Jeśli model został już załadowany do pamięci, możesz użyć metody createFromModelBuffer().

Przykładowy kod poniżej pokazuje użycie funkcji createFromOptions() do konfigurowania zadania. Funkcja createFromOptions() umożliwia dostosowanie punktowania pozy za pomocą opcji konfiguracji. Więcej informacji o opcjach konfiguracji znajdziesz w artykule Opcje konfiguracji.

Poniższy kod pokazuje, jak utworzyć i skonfigurować zadanie za pomocą opcji niestandardowych:

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
    });

Opcje konfiguracji

W tym zadaniu dostępne są te opcje konfiguracji aplikacji internetowych i aplikacji w języku JavaScript:

Nazwa opcji Opis Zakres wartości Wartość domyślna
runningMode Ustawia tryb działania zadania. Dostępne są 2 tryby:

IMAGE (Obraz): tryb dla pojedynczych obrazów wejściowych.

VIDEO: tryb dekodowanych klatek filmu lub transmisji na żywo danych wejściowych, np. z kamery.		 {IMAGE, VIDEO} IMAGE
numPoses Maksymalna liczba poz, które może wykryć Landmarker poz. Integer > 0 1
minPoseDetectionConfidence Minimalna wartość ufności wykrywania pozycji, która jest uznawana za prawidłową. Float [0.0,1.0] 0.5
minPosePresenceConfidence Minimalny wynik ufności obecności pozycji w wykrywaniu punktów orientacyjnych postawy. Float [0.0,1.0] 0.5
minTrackingConfidence Minimalny wynik ufności śledzenia pozycji ciała, aby uznać go za udany. Float [0.0,1.0] 0.5
outputSegmentationMasks Określa, czy narzędzie Pose Landmarker wygeneruje maskę segmentacji dla wykrytej postawy. Boolean False

Przygotuj dane

Narzędzie Pose Landmarker może wykrywać pozy na zdjęciach w dowolnym formacie obsługiwanym przez przeglądarkę hosta. Zadanie to obejmuje też wstępną obróbkę danych wejściowych, w tym ich zmianę rozmiaru, obrót i normalizację wartości. Aby rozpoznawać pozycje w filmach, możesz użyć interfejsu API do szybkiego przetwarzania pojedynczego kadru, korzystając z sygnatury czasowej, która określa, kiedy pozycje występują w filmie.

Uruchamianie zadania

Do wywoływania wniosków usługa Pose Landmarker używa metod detect() (z trybem działania IMAGE) i detectForVideo() (z trybem działania VIDEO). Zadanie przetwarza dane, próbuje oznaczyć punkty orientacyjne, a potem raportuje wyniki.

Wywołania metody detect() i detectForVideo() usługi rozpoznawania punktów orientacyjnych pozy działają synchronicznie i blokują wątek interpolacji użytkownika. Jeśli wykryjesz pozy w ramkach wideo z kamery urządzenia, każde wykrycie zablokuje główny wątek. Aby temu zapobiec, możesz zaimplementować web workery, aby uruchamiać metody detect() i detectForVideo() w innym wątku.

Poniższy kod pokazuje, jak wykonać przetwarzanie za pomocą modelu zadania:

Obraz

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

Wideo

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();
  });
}

Pełnięszą implementację zadania polegającego na wyznaczaniu punktów orientacyjnych w postaciach znajdziesz w przykładzie kodu.

Obsługa i wyświetlanie wyników

Funkcja Pose Landmarker zwraca obiekt poseLandmarkerResult dla każdego przebiegu wykrywania. Obiekt wyniku zawiera współrzędne każdego punktu orientacyjnego pozy.

Poniżej znajdziesz przykład danych wyjściowych z tego zadania:

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)

Dane wyjściowe zawierają zarówno znormalizowane współrzędne (Landmarks), jak i współrzędne globalne (WorldLandmarks) dla każdego punktu orientacyjnego.

Dane wyjściowe zawierają te sformatowane współrzędne (Landmarks):

  • x i y: współrzędne punktu orientacyjnego znormalizowane w zakresie od 0,0 do 1,0 przez szerokość (x) i wysokość (y) obrazu.

  • z: głębokość punktu orientacyjnego, w której głębokość w środku bioder jest traktowana jako punkt początkowy. Im mniejsza wartość, tym obiekt jest bliżej kamery. Wielkość z używa mniej więcej tej samej skali co x.

  • visibility: prawdopodobieństwo, że punkt orientacyjny jest widoczny na zdjęciu.

Dane wyjściowe zawierają te współrzędne świata (WorldLandmarks):

  • x, y i z: rzeczywiste współrzędne 3D w metrach, z środkiem bioder jako punktem początkowym.

  • visibility: prawdopodobieństwo, że punkt orientacyjny jest widoczny na zdjęciu.

Na ilustracji poniżej widać wizualizację wyniku zadania:

Kobieta w położeniu medytacji. Jej pozę wyróżnia szkielet, który wskazuje położenie kończyn i tułowia

Opcjonalna maska podziału na segmenty reprezentuje prawdopodobieństwo, że dany piksel należy do wykrytej osoby. Następujący obraz przedstawia maskę podziału na segmenty danych wyjściowych zadania:

Maska segmentacji poprzedniego obrazu, która wyznacza kształt kobiety

Przykładowy kod usługi Pose Landmarker pokazuje, jak wyświetlać wyniki zwrócone przez zadanie. Więcej informacji znajdziesz w przykładowym kodzie.