Как я могу получить непрерывные ориентиры из видео для Mediapipe Handpose

Question

Я новичок в Javascript. Я пытаюсь получить вывод из MediaPipe Handpose. Когда я добавляю изображение в эту модель, я легко получаю результат. Но когда я пытаюсь сделать видео, это не работает. Это голова

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-core"></script>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-converter"></script>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-backend-webgl"></script>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/handpose"></script>

Сведения о моем идентификаторе видео

<a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video">Source</a><br>
<video id="video" src="o_new.mp4" width="640" height="480" controls> 
</video>
<canvas id="canvas" style="overflow:auto"></canvas>

Внутри скрипта

<script>
     const video = document.getElementById("video");   

     
    async function main() {
  // Load the MediaPipe handpose model.
  const model = await handpose.load(maxContinuousChecks = 60);
        console.log('Model Loaded')

  // Pass in a video stream (or an image, canvas, or 3D tensor) to obtain a
  // hand prediction from the MediaPipe graph.
  const predictions = await model.estimateHands(video);
        console.log('Estimated Hand')
        console.log(predictions)
  if (predictions.length > 0) {
    /*
    `predictions` is an array of objects describing each detected hand, for example:
    [
      {
        handInViewConfidence: 1, // The probability of a hand being present.
        boundingBox: { // The bounding box surrounding the hand.
          topLeft: [162.91, -17.42],
          bottomRight: [548.56, 368.23],
        },
        landmarks: [ // The 3D coordinates of each hand landmark.
          [472.52, 298.59, 0.00],
          [412.80, 315.64, -6.18],
          ...
        ],
        annotations: { // Semantic groupings of the `landmarks` coordinates.
          thumb: [
            [412.80, 315.64, -6.18]
            [350.02, 298.38, -7.14],
            ...
          ],
          ...
        }
      }
    ]
    */

    for (let i = 0; i < predictions.length; i++) {
      const keypoints = predictions[i].landmarks;
        console.log('keypoints Loop')

      // Log hand keypoints.
      for (let i = 0; i < keypoints.length; i++) {
        const [x, y, z] = keypoints[i];
        console.log(`Keypoint ${i}: [${x}, ${y}, ${z}]`);
          
      }
    }
  }
}
    
 
main();
</script>

Как я могу получить непрерывные ориентиры в выходном объекте для видео?

Вот ошибка.

Answer 1

Я обновляю свой предыдущий ответ. Вы не хотите использовать установленный интервал, как я использовал свое предыдущее решение. Когда я использовал его более нескольких минут, он заполнил мою память графического процессора и вылетел из строя webgl. Я смог просмотреть файл demo.js разработчиков и нашел решение. В вашем js-файле замените функцию main() приведенным ниже кодом:

const state = {
  backend: 'webgl'
};


let model;


async function main() {
  await tf.setBackend(state.backend);
  model = await handpose.load();

  landmarksRealTime(video);
}

const landmarksRealTime = async (video) => {
  async function frameLandmarks() {
    const predictions = await model.estimateHands(video);
    
    if (predictions.length > 0) {
      const result = predictions[0].landmarks;
      console.log(result, predictions[0].annotations);

    }
    rafID = requestAnimationFrame(frameLandmarks);
  };

  frameLandmarks();
};


video.addEventListener("loadeddata", main);

Эта консоль записывает непрерывные ориентиры. Он ничего не регистрирует, если рука не обнаружена. Кроме того, похоже, что разработчики обновили рекомендуемые теги скриптов несколько дней назад, поэтому я бы рекомендовал обновить ваш файл index.html. Они должны быть:

<!-- Require the peer dependencies of handpose. -->
<script src="https://unpkg.com/@tensorflow/tfjs-core@2.1.0/dist/tf-core.js"></script>
<script src="https://unpkg.com/@tensorflow/tfjs-converter@2.1.0/dist/tf-converter.js"></script>

<!-- You must explicitly require a TF.js backend if you're not using the tfs union bundle. -->
<script src="https://unpkg.com/@tensorflow/tfjs-backend-webgl@2.1.0/dist/tf-backend-webgl.js"></script>
<!-- Alternatively you can use the WASM backend: <script src="https://unpkg.com/@tensorflow/tfjs-backend-wasm@2.1.0/dist/tf-backend-wasm.js"></script> -->

<script src="https://unpkg.com/@tensorflow-models/handpose@0.0.6/dist/handpose.js"></script></head>