Przewodnik wykrywania punktów orientacyjnych pozycji w przeglądarce

Zadanie MediaPipe Pose Landmarker umożliwia wykrywanie punktów orientacyjnych ciała człowieka na obrazie lub filmie. Możesz używać tego zadania do identyfikowania kluczowych lokalizacji ciała, analizowania postawy i kategoryzowania ruchów. To zadanie wykorzystuje modele uczenia maszynowego, które działają na pojedynczych obrazach lub filmach. Zadanie zwraca punkty orientacyjne pozycji ciała w współrzędnych obrazu i w 3-wymiarowych współrzędnych świata.

Z tych instrukcji dowiesz się, jak używać narzędzia Pose Landmarker w aplikacjach internetowych i aplikacjach napisanych w JavaScript. Więcej informacji o możliwościach, modelach i opcjach konfiguracji tego zadania znajdziesz w Przeglądzie.

Przykładowy kod

Przykładowy kod do wykrywania punktów orientacyjnych na ciele zawiera kompletną implementację tego zadania w JavaScript. Ten kod pomoże Ci przetestować to zadanie i zacząć tworzyć własną aplikację do wykrywania punktów orientacyjnych na sylwetce. Możesz wyświetlać, uruchamiać i edytować przykład wykrywania punktów orientacyjnych na sylwetce za pomocą przeglądarki.

Konfiguracja

W tej sekcji opisujemy najważniejsze kroki konfigurowania środowiska programistycznego, które jest przeznaczone do korzystania z modelu Pose Landmarker. Ogólne informacje o konfigurowaniu środowiska programistycznego dla sieci i JavaScriptu, w tym wymagania dotyczące wersji platformy, znajdziesz w przewodniku konfiguracji dla sieci.

Pakiety JavaScript

Kod narzędzia Pose Landmarker jest dostępny w pakiecie MediaPipe @mediapipe/tasks-vision NPM. Te biblioteki możesz znaleźć i pobrać, postępując zgodnie z instrukcjami w przewodniku 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.mjs"
    crossorigin="anonymous"></script>
</head>

Model

Zadanie MediaPipe Pose Landmarker wymaga wytrenowanego modelu, który jest z nim zgodny. Więcej informacji o dostępnych wytrenowanych modelach do wykrywania punktów orientacyjnych na ciele znajdziesz w sekcji Modele w omówieniu zadania.

Wybierz i pobierz model, a następnie zapisz go w katalogu projektu:

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

Tworzenie zadania

Użyj jednej z funkcji Pose Landmarker createFrom...(), aby przygotować zadanie do uruchomienia wnioskowania. Użyj funkcji createFromModelPath() ze ścieżką względną lub bezwzględną do wytrenowanego pliku modelu. Jeśli model jest już załadowany do pamięci, możesz użyć metody createFromModelBuffer().

Poniższy przykładowy kod pokazuje, jak skonfigurować zadanie za pomocą funkcji createFromOptions(). Funkcja createFromOptions() umożliwia dostosowanie narzędzia Pose Landmarker za pomocą opcji konfiguracji. Więcej informacji o opcjach konfiguracji znajdziesz w artykule Opcje konfiguracji.

Poniższy kod pokazuje, jak utworzyć i skonfigurować zadanie z opcjami niestandardowymi:

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

To zadanie ma te opcje konfiguracji w przypadku aplikacji internetowych i aplikacji napisanych w języku JavaScript:

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

OBRAZ: tryb dla pojedynczych obrazów.

WIDEO: tryb dla zdekodowanych klatek filmu lub transmisji na żywo danych wejściowych, np. z kamery.
{IMAGE, VIDEO} IMAGE
numPoses Maksymalna liczba póz, które może wykryć Pose Landmarker. Integer > 0 1
minPoseDetectionConfidence Minimalny wynik ufności, przy którym wykrywanie pozy zostanie uznane za udane. Float [0.0,1.0] 0.5
minPosePresenceConfidence Minimalny poziom ufności wykrycia pozycji w wykrywaniu punktów orientacyjnych pozycji. Float [0.0,1.0] 0.5
minTrackingConfidence Minimalny poziom ufności, przy którym śledzenie pozycji jest uznawane za udane. Float [0.0,1.0] 0.5
outputSegmentationMasks Określa, czy narzędzie Pose Landmarker ma generować maskę segmentacji wykrytej pozy. Boolean False

Przygotuj dane

Model Pose Landmarker może wykrywać pozy na obrazach w dowolnym formacie obsługiwanym przez przeglądarkę hosta. Zadanie to obejmuje też wstępne przetwarzanie danych wejściowych, w tym zmianę rozmiaru, obracanie i normalizację wartości. Aby oznaczyć pozycje w filmach, możesz użyć interfejsu API do szybkiego przetwarzania pojedynczych klatek, używając sygnatury czasowej klatki do określenia, kiedy pozycje występują w filmie.

Uruchamianie zadania

Model Pose Landmarker używa metod detect() (w trybie IMAGE) i detectForVideo() (w trybie VIDEO) do wywoływania wnioskowania. Zadanie przetwarza dane, próbuje określić pozycje punktów orientacyjnych, a następnie raportuje wyniki.

Wywołania metod Pose Landmarker detect()detectForVideo() działają synchronicznie i blokują wątek interfejsu użytkownika. Jeśli wykrywasz pozy w klatkach wideo z kamery urządzenia, każde wykrycie blokuje główny wątek. Możesz temu zapobiec, wdrażając procesy robocze, które będą uruchamiać metody detect()detectForVideo() w innym wątku.

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

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

Aby uzyskać pełniejszą implementację zadania Pose Landmarker, zapoznaj się z przykładem.

Obsługa i wyświetlanie wyników

Detektor punktów orientacyjnych na ciele zwraca obiekt poseLandmarkerResult dla każdego wykrycia. Obiekt wyniku zawiera współrzędne każdego punktu orientacyjnego.

Poniżej znajdziesz przykład danych wyjściowych 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ą znormalizowane współrzędne (Landmarks) i współrzędne świata (WorldLandmarks) dla każdego punktu orientacyjnego.

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

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

  • z: głębokość punktu orientacyjnego, przy czym głębokość w połowie bioder jest punktem początkowym; Im mniejsza wartość, tym bliżej aparatu znajduje się punkt orientacyjny. Wartość z ma w przybliżeniu tę samą skalę co x.

  • visibility: prawdopodobieństwo, że punkt orientacyjny jest widoczny na obrazie.

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

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

  • visibility: prawdopodobieństwo, że punkt orientacyjny jest widoczny na obrazie.

Obraz poniżej przedstawia wizualizację wyniku zadania:

Kobieta w pozycji medytacyjnej. Jej sylwetka jest podkreślona siatką, która wskazuje położenie kończyn i tułowia.

Opcjonalna maska segmentacji przedstawia prawdopodobieństwo, że każdy piksel należy do wykrytej osoby. Obraz poniżej przedstawia maskę segmentacji danych wyjściowych zadania:

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

Przykładowy kod Pose Landmarker pokazuje, jak wyświetlać wyniki zwrócone przez zadanie. Zobacz przykład.