Présentation de LiteRT: l'environnement d'exécution Google hautes performances pour l'IA sur l'appareil, anciennement connu sous le nom de TensorFlow Lite.

Cette page a été traduite par l'API Cloud Translation.

Guide de détection des points de repère de position pour le Web

La tâche MediaPipe Pose Markerer vous permet de détecter les points de repère de corps humain dans une image ou vidéo. Vous pouvez utiliser cette tâche pour identifier les emplacements clés du corps, analyser la posture, et catégoriser les mouvements. Cette tâche utilise des modèles de machine learning (ML) avec des images ou des vidéos uniques. La tâche génère des points de repère concernant les postures du corps dans une image en 3D et en 3D.

Ces instructions vous expliquent comment utiliser le repère de postures pour le Web et JavaScript. applications. Pour en savoir plus sur les fonctionnalités, les modèles et la configuration options de cette tâche, consultez la section Présentation.

Exemple de code

L'exemple de code pour Pose Markerer fournit une implémentation complète de ce en JavaScript à titre de référence. Ce code vous aide à tester cette tâche et à obtenir vous avez commencé à créer votre propre application de création de repères. Vous pouvez afficher, exécuter modifier l'exemple de code du repère de postures ; en utilisant uniquement votre navigateur Web.

Configuration

Cette section décrit les étapes clés à suivre pour configurer votre environnement de développement spécifiquement pour utiliser Pose Markerer. Pour obtenir des informations générales sur à configurer votre environnement de développement Web et JavaScript, y compris versions de la plate-forme requises, consultez la Guide de configuration pour le Web

Packages JavaScript

Le code Pose Markerer est disponible via MediaPipe @mediapipe/tasks-vision. NPM. Vous pouvez recherchez et téléchargez ces bibliothèques en suivant les instructions Guide de configuration

Vous pouvez installer les packages requis via NPM en exécutant la commande suivante:

npm install @mediapipe/tasks-vision

Si vous souhaitez importer le code de la tâche via un réseau de diffusion de contenu (CDN) ajoutez le code suivant dans la section <head> dans votre fichier 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>

Modèle

La tâche MediaPipe Pose Markerer nécessite un modèle entraîné compatible avec cette tâche. Pour en savoir plus sur les modèles entraînés disponibles pour Pose Repèreer, consultez la section Modèles de la présentation des tâches.

Sélectionnez et téléchargez un modèle, puis stockez-le dans le répertoire de votre projet:

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

Créer la tâche

Utilisez l'une des fonctions Pose Markerer createFrom...() pour : préparer la tâche à exécuter des inférences. Utiliser le createFromModelPath() avec un chemin d'accès relatif ou absolu vers le fichier de modèle entraîné. Si votre modèle est déjà chargé en mémoire, vous pouvez utiliser la createFromModelBuffer().

L'exemple de code ci-dessous montre comment utiliser la fonction createFromOptions() pour configurer la tâche. La fonction createFromOptions() vous permet de personnaliser Posez des repères de signalisation avec des options de configuration. Pour en savoir plus sur la configuration consultez la section Options de configuration.

Le code suivant montre comment compiler et configurer la tâche avec des options:

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

Options de configuration

Cette tâche comporte les options de configuration suivantes pour le Web et JavaScript applications:

Nom de l'option	Description	Plage de valeurs	Valeur par défaut
`runningMode`	Définit le mode d'exécution de la tâche. Il y a deux modes: IMAGE: mode utilisé pour la saisie d'une seule image. VIDÉO: mode utilisé pour les images décodées d'une image vidéo ou sur un flux en direct de données d'entrée, comme celles d'une caméra.	{`IMAGE, VIDEO`}	`IMAGE`
`numPoses`	Nombre maximal de postures pouvant être détectées par le Repère de position.	`Integer > 0`	`1`
`minPoseDetectionConfidence`	Score de confiance minimal pour que la détection de postures soit considéré comme réussi.	`Float [0.0,1.0]`	`0.5`
`minPosePresenceConfidence`	Score de confiance minimal de la présence de la pose dans la détection des points de repère de pose.	`Float [0.0,1.0]`	`0.5`
`minTrackingConfidence`	Score de confiance minimal pour le suivi des postures pour être considéré réussi.	`Float [0.0,1.0]`	`0.5`
`outputSegmentationMasks`	Permet d'afficher ou non un masque de segmentation pour le repère de posture .	`Boolean`	`False`

Préparer les données

Le repère de postures peut détecter les postures dans les images dans n'importe quel format compatible avec le navigateur hôte. Elle gère également le prétraitement des entrées de données, le redimensionnement, la rotation et la normalisation des valeurs. Pour montrer des postures identifiables dans les vidéos, vous pouvez utiliser l'API pour traiter rapidement une image à la fois, à l'aide du code temporel de l'image pour déterminer à quel moment les postures se produisent dans la vidéo.

Exécuter la tâche

Le repère de postures utilise le detect() (avec le mode de course IMAGE) et detectForVideo() (avec le mode d'exécution VIDEO) pour déclencher les inférences. La tâche traite les données, essaie de déterminer des postures puis génère un rapport présentant les résultats.

Les appels vers les méthodes detect() et detectForVideo() de Pose Markerer s'exécutent. de manière synchrone et de bloquer le thread d'interposition de l'utilisateur. Si vous détectez des postures dans les images vidéo de la caméra d'un appareil, chaque détection bloque thread. Pour éviter cela, implémentez des nœuds de calcul Web afin d'exécuter detect(). et detectForVideo() sur un autre thread.

Le code suivant montre comment exécuter le traitement avec le modèle de tâche:

Image

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

Vidéo

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

Pour une implémentation plus complète de l'exécution d'une tâche Pose Markerer, consultez la exemple de code.

Gérer et afficher les résultats

Le repère de postures renvoie un objet poseLandmarkerResult pour chaque détection. exécuter. L'objet de résultat contient les coordonnées de chaque point de repère de la position.

Voici un exemple de données de sortie de cette tâche:

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)

La sortie contient à la fois les coordonnées normalisées (Landmarks) et le monde coordonnées (WorldLandmarks) de chaque point de repère.

La sortie contient les coordonnées normalisées suivantes (Landmarks):

x et y: coordonnées des points de repère normalisées entre 0,0 et 1,0 par le la largeur (x) et la hauteur (y) de l'image.
z: profondeur du point de repère, la profondeur au milieu des hanches origine. Plus la valeur est faible, plus le point de repère est proche de la caméra. La la magnitude de z utilise à peu près la même échelle que x.
visibility: probabilité que le point de repère soit visible dans l'image.

La sortie contient les coordonnées mondiales suivantes (WorldLandmarks):

x, y et z: coordonnées tridimensionnelles du monde réel en mètres, avec l'attribut le milieu des hanches comme origine.
visibility: probabilité que le point de repère soit visible dans l'image.

L'image suivante montre une visualisation du résultat de la tâche:

Le masque de segmentation facultatif représente la probabilité que chaque pixel appartienne à une personne détectée. L'image suivante montre un masque de segmentation résultat de la tâche:

L'exemple de code Pose Markerer montre comment afficher les renvoyés par la tâche, consultez la exemple de code